Question:
Cat Form
 <form action="https://freecatphotoapp.com/submit-cat-photo">  <fieldset>  --fcc-editable-region--  <fieldset>  <input id="indoor" type="radio" name="indoor-outdoor" value="indoor"> Indoor <input id="outdoor" type="radio" name="indoor-outdoor" value="outdoor"> Outdoor  --fcc-editable-region--  </fieldset>  --fcc-editable-region--  <input type="text" name="catphotourl" placeholder="cat photo URL" required> <button type="submit">Submit</button> </form>

In RWB, the placement of the instructions interrupts the code and makes indentation unclear, especially for a beginner that may not know what to look for yet. I noticed several instances where putting longer, uninterrupted part of the code in the highlighted editor might help with clarity. <h2Examples</h2<a href=""Step 21</a: change the error message or expand the highlighted code. (Error message when h3 is in the wrong location: "There should be an h3 element right above the second section element's closing tag.") <a href=""Step 23</a: include in highlighted editor to match the instructions ("A figure caption (figcaption) element is used to add a caption to describe the image contained withing the figure element.") and to show the placement of within . <a href=""Step 50</a: include in highlighted editor to match the instructions ("The legend element acts as a caption for the content in the fieldset element.") and to show the placement of within . <h2Proposed solutions</h2- Expand the code on case-per-case basis. Permanently move the instructions box on top of the code editor. (I think that would make everything clearer and more accessible with well defined sections on the page, but I imagine it would be harder to implement now.)
I don't believe we would go this route, as the instructions UI was specifically designed to allow us to highlight the section of code a camper should be editing. I do agree some of these regions could be tweaked a bit
Thank you for reading through it! I will admit I that secondary suggestion because of a personal issue as well, as I find the page a bit overwhelming and every time I click on the next step, it takes me a while to find and re-focus on the editor. I think there's just a lot going on visually, but I'm not a UI/UX designer so I don't have specific suggestions except for the fixed placement.
I'm fine with changing the three lessons mentioned here, but we could maybe use a discussion on how those regions should be. There's probably going to be many steps where the editable region could be bigger or smaller or different. Maybe we need some hard rules on how to apply them. Something like - for HTML steps, include the parent element in the region. For CSS steps, include the whole selector.


Question:
Cat Form
 <form action="https://freecatphotoapp.com/submit-cat-photo">  <fieldset>  --fcc-editable-region--  <fieldset>  <input id="indoor" type="radio" name="indoor-outdoor" value="indoor"> Indoor <input id="outdoor" type="radio" name="indoor-outdoor" value="outdoor"> Outdoor  --fcc-editable-region--  </fieldset>  --fcc-editable-region--  <input type="text" name="catphotourl" placeholder="cat photo URL" required> <button type="submit">Submit</button> </form>

There may be instances where rules like that don't work out so well. Like for the first steps of the Cat Photo project, we may want to be more specific about where to add code - and on later steps or projects, more vague. So I don't know.
I did bring this up, but we were on the fence with:
Yeah it seems like something that's more of a case-by-case basis than to have hard and fast rules for. My proposed "general" approach would be to encapsulate anything the instructions mention. So if the instructions say "write a h2 below your h1", the h1 should be within the editable region.
To try and get this issue resolved, I vote for these changes: step 21: change the hint to "There should be an img element right after the closing tag." step 23: use op's suggestion step 50: use op's suggestion
Thank you for reporting this issue. An easy fix would be to scroll the editor so the instructions are always almost at the top of the "page". That way the eyes know where to go on each challenge. (right now it scrolls to the center) I am interested in knowing more about this: " it takes me a while to find and re-focus on the editor." Are you having difficulty locating the instructions? do also look around for the tests and the submit button? More context is appreciated. We ultimately need to usability test this with people who have not seen the curriculum.
Hello, sorry for the late reply. After seeing this notification, I opened the curriculum on a random step to see if I could provide you with more information. I mostly forgot how the page was structured and my eyes just ran across the page in no specific order. "Check your code" was the first text I read, as it draws the most attention, and then "". I believe that would be very helpful! (I think it would also be nice if the navigation breadcrumbs were more subtle, and if the buttons like "", "" and "preview" looked more like toggle buttons – now they remind me of tabs but disconnected from their sections, and they also draw more attention than is perhaps needed?) Thank you for checking in on this!
Thank you for your feedback.


Question: // eslint-disable-next-line max-len it('Worker executor should successfully execute 3 tasks and use 1 worker', async () => { mockWorker(); <del> const testWorker = createWorker('test', { concurrency: 1 }); </del> <ins> const testWorker = createWorker('test', { maxWorkers: 1 }); </ins> const task1 = testWorker.execute('test1'); const task2 = testWorker.execute('test2');

Describe the bug Sass pages with invalid syntax occasionally timeout To Reproduce Steps to reproduce the behavior: to in in the console (sometimes) Expected behavior The following should appear in the console: Since this is intermittent, here's a gif to demonstrate: ! Additional Context When the error appears it does so very quickly, so it is unlikely that this is due to a genuine timeout.
Hey Oliver, When I clicked on the link, I reset the code, and completed the challenge as it should be completed. I came across a error, and was unable to run the tests. However, after resetting the code, refreshing the page, and pasting in the code you provided (missing ), the error you mention appeared, but does not disappear. So, I suspect it has to do with the page first load, because I can get the error only if I: 1) reset the code 2) Duplicate the tab 3) Input the incorrect code (missing ) !
I tried method but that didn't produce the bug. I am able to reliably reproduce the bug on Chromium & Firefox with the following steps: the page (new tab & refresh can both produce bug). delete & re-add the character from line 9, fast enough that the new state does not display in the console. step 2 on deleting the . If done correctly the message will display instead of an error, even though the console input is incorrect. approximately 3-5 seconds for the timeout message to appear. Note: it can also be reproduced where by in step 2 you end on re-adding the but it's harder to tell if the bug has happened. It must have something to do with the console state change and the output error check conflicting.
I worked on this issue on my old computer that is very slow and on my main PC (with a dual boot). On my old computer I have the same result as regurlaly timeouts. On the new one to have this issue I have to paste 3 times the piece of code to reproduce it. But everytimes, this is a real timeout (5ms, I put 'new Date()' on the code).


Question: // eslint-disable-next-line max-len it('Worker executor should successfully execute 3 tasks and use 1 worker', async () => { mockWorker(); <del> const testWorker = createWorker('test', { concurrency: 1 }); </del> <ins> const testWorker = createWorker('test', { maxWorkers: 1 }); </ins> const task1 = testWorker.execute('test1'); const task2 = testWorker.execute('test2');

We can upgrade the source code one "execute-challenge-" with this kind of stuff to have a best message, but still the problem : <prelet errMsg = 'error'; if (err === 'timeout') { // eslint-disable-next-line no-ex-assign errMsg = ; } else if (Array.isArray(err) && err.length0 && err[0] === 'timeout') { // timeout: 5ms errMsg = ; } else { errMsg = err; } (errMsg); yield put(updateConsole(escape(errMsg))); </preso the result will be "Server response timeout"
While this is old, it's still reproducible, unfortunately. A PR to improve the warning would be welcome.
I’m currently taking a look into a possible solution on this!


Question: import { bindActionCreators } from 'redux'; import EditorTabs from './EditorTabs'; import { showUpcomingChanges } from '../../../../../config/env.json'; <ins> import i18next from 'i18next'; </ins> const mapStateToProps = createStructuredSelector({ currentTab: currentTabSelector

Describe the bug When you enter a challenge using a mobile device, the tabs below the main header are displayed with untranslated text To Reproduce Steps to reproduce the behavior (mobile device): to untranslated tabs below the main header Expected behavior Tabs text should be translated. Screenshots Spanish site ! Chinese site ! Desktop (please complete the following information): OS: [Windows 10] Browser: [chrome] Version: [88] Additional context Those strings are not available yet on the Crowdin platform.


Question: "workshop-blog-page": { "title": "Build a Cat Blog Page", "intro": [  "In this workshop, you will learn how to build an HTML only blog page using semantic elements including the main, nav, article and footer elements."   "In this workshop, you will learn how to build an HTML only blog page using semantic elements including the main, nav, article and footer elements."  ] }, "szcd": { "title": "13", "intro": [] },

Keywords in the following sentence should be wrapped within . Update the file with this change:
This issue is open to first-time code contributors to this repository. The file that you should be updating is linked in the original post. We typically do not assign issues. Instead, we accept the most quality contribution followed by the one that is made first. Please make sure you read our as well as our , we prioritize contributors following the instructions in our guides. Join us in our or our if you need help contributing; our moderators will guide you through this. Happy contributing.
I can work on this.
Are you still working on this?
I submitted a pull request () that is waiting to be reviewed.
I would like to work on this.
I can work on this.


Question:
 <div class="spacer"  style="padding: 15px 0px; height: 1px;"   style="padding: 15px 0px;"  />
 <div class="spacer"  style="padding: 15px 0px; height: 1px;"   style="padding: 15px 0px;"  />
 <div

We have instances which is used to provide spacing for both side of the component to wrap it up in specific space Example: We can make the Spacer component smarter, and allow it to accept children, so the code be like. But in doing so, we need to: change the current values and how the padding is calculated, the old layout shouldn't change with the new spacers. change which padding has the new value, I think paddingBlock, which is paddingTop and paddingBottom, is the new padding property . I am requesting this because this will make live simpler, and we have to worry about less elements while controling the layout, and if we have specific cases, we can still use
There is an abstraction with , we need address, it's better if we can specify the direction of the padding. but this can be sorted in another issue, for now to solve this issue please allow to have children prop inside of it, but the current styles of the curriculum shouldn't change. If you would like to fix this issue, please make sure you read , we prioritize contributors following the instructions in our guides. Join us in or if you need help contributing, our prolific contributors will guide you through this.
Hey I have few questions while looking into this issue are few files where we have used Spacer, so may I just change wrap the content where ever needed or it would be handled in new issue? (I guess it must be done in other issue, as it would be easy to maintain) have implemented the children props, so may I raise a PR? Will break this issue in 2 other issues as well. 1 for wrapping the places it has been used, and 2nd for specifying the direction. I was wrapping and trying it out, I found out that Spacer has been used at every 2nd-3rd line of code, so do we need such a wrapper which would give spacing to all components present inside it or only to the parent component? EG: If we have 2 divs wrapped inside Spacer, then does both div have the spacing around them or only the outmost div.


Question:
 <div class="spacer"  style="padding: 15px 0px; height: 1px;"   style="padding: 15px 0px;"  />
 <div class="spacer"  style="padding: 15px 0px; height: 1px;"   style="padding: 15px 0px;"  />
 <div

sorry for the delay, it was difficult to understand what you mean without looking at an example of code, so to answer you: yes the direction will be in a second issue, but the spacing and values should still be in this issue, so the pages won't look different Of course, please raise a PR after reading the guideline, nicely done . The Spacer shouldn't affect the children inside of it, think of it as creating a container with margin-block to space the area of the children inside of it from other areas
I guess we could close this issue
will be closed when the height is removed in the other PR


Question: margin: 0; padding: 0; } .certification-namespace h1 { margin: 12px 0; } .certification-namespace.container { max-width: 1500px; width: 100%;

Is your feature request related to a problem? Please describe. Currently the certificates lack any white space along the top border, making them difficult to screenshot and/or print: ! We should add some white space to the top of the page so the certificate is centered.


Question:
section: PropTypes.string };  function ChallengeDescription({ description, instructions, section }) { return ( <div className={`challenge-instructions ${section}`}>
 {instructions && ( <Fragment>

 </Fragment> )}

 );   class ChallengeDescription extends Component { componentDidMount() { // Just in case 'current' has not been created, though it should have been. if (this.instructionsRef.current) { Prism.highlightAllUnder(this.instructionsRef.current); } } constructor(props) { super(props); this.instructionsRef = React.createRef(); } render() { const { description, instructions, section } = this.props; return ( <div className={`challenge-instructions ${section}`} ref={this.instructionsRef} >
 {instructions && ( <Fragment>

 </Fragment> )}

 ); }  } ChallengeDescription.displayName = 'ChallengeDescription';

Related to . Once that's done, the code blocks will be written in blocks of  into ! while the same code on the guide looks like ! I think this change would make the code blocks easier to read, make the guide and challenges feel more like parts of a unified whole and fit better with the code editor aesthetic discussed in the . I'd be happy to work on this, if this is useful feature What do you think?
You should look into for this sort of thing. Goodluck. this is something we would probably be needing and using across Guide and Learn. So, I'll let you chime in and guide on this.


Question: # --description-- <del> Add an `else` block to handle the current song's position in the playlist. </del> <ins> Add an `else` block to handle the song's current playback time. This allows you to resume the current song at the point where it was paused. </ins> Within the `else` block, set the `currentTime` property of the `audio` object to the value stored in `userData?.songCurrentTime`.

please clarify the instructions for step 39 of JS Beta Build a Music Player Currently they consist of 2 sentences: "Add an else block to handle the current song’s position in the playlist. Within the else block, set the currentTime property of the audio object to the value stored in userData?.songCurrentTime." The first sentence doesn't seem to relate to the second. It is not clear how 'the current song's position in the playlist" is affected by the actions requested of setting the audio object's currentTime? This makes me think that there's a mistake in the first sentence (or maybe I've misunderstood what it is trying to say so it needs more clarification) N/A N/A No response N/A No response
I don't think it has anything to do with the playlist order. The only thing is used for is pause/play (it gets reset everywhere else). Maybe it can just be:
My thoughts was that the else block was designed to continue playing the song at the place you stopped it. The current song has been chosen and it's same id of the song. In the block, we're setting the time to zero. In the else block, we're setting it at the old time.
FYI: I attempted to test pausing and restarting the song but it always restarted from the beginning.
In what step did you test it? If you go to the last step, the play/pause should work as intended (or to whatever step has it implemented). Pausing saves the audio element's current time to , and playing restores it back to the element's current time when is available.
I see, I thought I would be able to pause and play something else then come back to the original selection and it would start from where I stopped (but I don't think the code was created for that).
Nah. It only resumes and plays back for the current song. Once you switch songs, it forgets where you left off on the old one.
I would be fine adding something like "This allows you to resume the current song at the point where it was paused."
This looks like something that can be fixed by "first time" code contributors to this repository. Here is the file that you should be looking at to work on a fix: Change: To: Please make sure you read , we prioritize contributors following the instructions in our guides.


Question: # --description-- <del> Add an `else` block to handle the current song's position in the playlist. </del> <ins> Add an `else` block to handle the song's current playback time. This allows you to resume the current song at the point where it was paused. </ins> Within the `else` block, set the `currentTime` property of the `audio` object to the value stored in `userData?.songCurrentTime`.

Join us in our chat room or the forum if you need help contributing, our moderators will guide you through this. Sometimes we may get more than one pull-requests. We typically accept the most quality contribution followed by the one that is made first. Happy contributing.


Question: # --description-- <del> Set `monsterHealth` to `monsterHealth` minus the power of the player's current weapon. Remember you have the `currentWeapon` variable and the `power` property. </del> <ins> Set `monsterHealth` to `monsterHealth` minus the power of the player's current weapon. Remember that you can access the power of the player's current weapon using `weapons[currentWeapon].power`. </ins> # --hints--

The instruction are not clear, right now it says Edit: This is actually step 120 in the main branch Set monsterHealth to monsterHealth minus the power of the player's current weapon. Remember you have the currentWeapon which is not initialized variable and the power property on weapons array. No response Device: Laptop OS: macOS Browser: Chrome I think it should be more detail about what and where is currentWeapon, power property and how to access it like in previous.
It looks like currentWeapon is initalized with the value of 0 here Then it is updated over time throughout the project. I think for that second sentence it should be clear about syntax on how to access those values since beginners are still struggling with that. Being more explicitly will help with confusion on the forum posts. Let's go with this change.
This has been opened for contribution. The first comprehensive PR created will be reviewed and merged. We typically do not assign issues to anyone other than long-time contributors. If you would like to contribute and have not read the contributors docs, please do so here: If you have any issues with contributing, be sure to join us on the , or on the Happy coding


Question: const propTypes = { canFocusEditor: PropTypes.bool, children: PropTypes.any, <ins> editorRef: PropTypes.object, </ins> executeChallenge: PropTypes.func, innerRef: PropTypes.any, introPath: PropTypes.string,

Is your feature request related to a problem? Please describe. It currently can take a several key presses to navigate to the editor if it does not have focus. Describe the solution you'd like It should be possible to focus on the editor with a hotkey, for example 'e'. The issue where this was mostly discussed will be closed soon, but some thoughts about implementing this appeared there:


Question: # --description-- <ins> In programming, it is standard practice to prefix a variable with `is` or `has` to indicate that the variable is a boolean. ```js let isRunning = true; let hasCompleted = false; ``` </ins> Declare an `isError` variable and set it to `false`, but use `let` so you can reassign it later. # --hints--

Throughout the curriculum, we often have campers name variables that represent booleans with the prefix of or which follow standard convention. But we never really explain that to them. I think that step 17 would be a good place do that. js let isRunning = true; let hasCompleted = false; ` see explanation above see explanation above No response Device: [e.g. iPhone 6, Laptop] OS: [e.g. iOS 14, Windows 10, Ubuntu 20.04] Browser: [e.g. Chrome, Safari] Version: [e.g. 22] No response
This has been opened for contribution. The first comprehensive PR created will be reviewed and merged. We typically do not assign issues to anyone other than long-time contributors. If you would like to contribute and have not read the contributors docs, please do so here: If you have any issues with contributing, be sure to join us on the , or on the Happy coding


Question: "difficulty": 0.13, "challengeSeed": "125671865", "description": [  "jQuery is a powerful tool for manipulating HTML elements.", "It's a lot easier to use than JavaScript itself, so we'll learn it first.",   "jQuery is a powerful library built in Javascript for manipulating HTML elements.", "It's a lot easier to use than Javascript itself, so we'll learn it first.",  "It's also extremely popular with employers, so we're going to learn it well.", "Codecademy has an excellent free course that will walk us through the basics of jQuery.", "Go to http://www.codecademy.com/courses/web-beginner-en-bay3D/0/1 and complete the first section."

The copy here seems misleading especially for those coming from no knowledge of javascript. It looks as though jQuery isn't also Javascript. ! [] 1) jQuery is a powerful tool for manipulating HTML elements. 2) It's a lot easier to use than JavaScript itself, so we'll learn it first. 1) jQuery is a powerful javascript framework for manipulating HTML elements. 2) It's a lot easier to use than plain JavaScript itself, so we'll learn it first.


Question: Three circles of equal radius are placed inside a larger circle such that each pair of circles is tangent to one another and the inner circles do not overlap. There are four uncovered "gaps" which are to be filled iteratively with more tangent circles.       At each iteration, a maximally sized circle is placed in each gap, which creates more gaps for the next iteration. After 3 iterations (pictured), there are 108 gaps and the fraction of the area which is not covered by circles is 0.06790342, rounded to eight decimal places.

<!-- NOTE: If you're reporting a security issue, don't create a GitHub issue. Instead, email We will look into it immediately. --In the challenge below, the alt text for the diagram is set to "a diagram of non-overlapping concentric circles". But if my understanding is correct, they are not "concentric circles" (circles which share the same center). <!-- Add a link to the coding challenge with the problem. --Coding Interview Prep Project Euler Problem 199: Iterative Circle Packing <!-- Add a clear and concise description of what you expected to happen. --The alt text should be changed to "a diagram of non-overlapping circles" or something. (I'm not a native English speaker, so please fix it if there is a better description.) <!-- If applicable, add screenshots to help explain your problem. you can drag and drop, png, jpg, gif, etc. in this box. --! <!-- Please complete the following information. --- Device: Laptop OS: Windows 10 Browser: chrome Version: 96.0.4664.45 <!-- Add any other context about the problem here. --Originally reported in a comment on Crowdin duing translation.
Thanks for opening this issue. This looks something that can be fixed by "first time" code contributors to this repository. Here are the files that you should be looking at to work on a fix: List of files: Please make sure you read , we prioritize contributors following the instructions in our guides. Join us in or if you need help contributing, our moderators will guide you through this. Sometimes we may get more than one pull requests. We typically accept the most quality contribution followed by the one that is made first. Happy contributing.
I would like to work on this.
Hey Issues are typically not assigned to a specific person, other than long-time contributors. You can read more about this at Issues labelled with or are open for contributions for all. Please make sure you read . Join us in or if you need help contributing, our moderators will guide you through this.
sorry about that, as this was my first time in freeCodeCamp, I'll make sure to read the contribution guidelines


Question:
laser pointers

lasagna

  --fcc-editable-region--
    --fcc-editable-region--
  --fcc-editable-region--

In RWB, the placement of the instructions interrupts the code and makes indentation unclear, especially for a beginner that may not know what to look for yet. I noticed several instances where putting longer, uninterrupted part of the code in the highlighted editor might help with clarity. <h2Examples</h2<a href=""Step 21</a: change the error message or expand the highlighted code. (Error message when h3 is in the wrong location: "There should be an h3 element right above the second section element's closing tag.") <a href=""Step 23</a: include in highlighted editor to match the instructions ("A figure caption (figcaption) element is used to add a caption to describe the image contained withing the figure element.") and to show the placement of within . <a href=""Step 50</a: include in highlighted editor to match the instructions ("The legend element acts as a caption for the content in the fieldset element.") and to show the placement of within . <h2Proposed solutions</h2- Expand the code on case-per-case basis. Permanently move the instructions box on top of the code editor. (I think that would make everything clearer and more accessible with well defined sections on the page, but I imagine it would be harder to implement now.)
I don't believe we would go this route, as the instructions UI was specifically designed to allow us to highlight the section of code a camper should be editing. I do agree some of these regions could be tweaked a bit
Thank you for reading through it! I will admit I that secondary suggestion because of a personal issue as well, as I find the page a bit overwhelming and every time I click on the next step, it takes me a while to find and re-focus on the editor. I think there's just a lot going on visually, but I'm not a UI/UX designer so I don't have specific suggestions except for the fixed placement.
I'm fine with changing the three lessons mentioned here, but we could maybe use a discussion on how those regions should be. There's probably going to be many steps where the editable region could be bigger or smaller or different. Maybe we need some hard rules on how to apply them. Something like - for HTML steps, include the parent element in the region. For CSS steps, include the whole selector.


Question:
laser pointers

lasagna

  --fcc-editable-region--
    --fcc-editable-region--
  --fcc-editable-region--

There may be instances where rules like that don't work out so well. Like for the first steps of the Cat Photo project, we may want to be more specific about where to add code - and on later steps or projects, more vague. So I don't know.
I did bring this up, but we were on the fence with:
Yeah it seems like something that's more of a case-by-case basis than to have hard and fast rules for. My proposed "general" approach would be to encapsulate anything the instructions mention. So if the instructions say "write a h2 below your h1", the h1 should be within the editable region.
To try and get this issue resolved, I vote for these changes: step 21: change the hint to "There should be an img element right after the closing tag." step 23: use op's suggestion step 50: use op's suggestion
Thank you for reporting this issue. An easy fix would be to scroll the editor so the instructions are always almost at the top of the "page". That way the eyes know where to go on each challenge. (right now it scrolls to the center) I am interested in knowing more about this: " it takes me a while to find and re-focus on the editor." Are you having difficulty locating the instructions? do also look around for the tests and the submit button? More context is appreciated. We ultimately need to usability test this with people who have not seen the curriculum.
Hello, sorry for the late reply. After seeing this notification, I opened the curriculum on a random step to see if I could provide you with more information. I mostly forgot how the page was structured and my eyes just ran across the page in no specific order. "Check your code" was the first text I read, as it draws the most attention, and then "". I believe that would be very helpful! (I think it would also be nice if the navigation breadcrumbs were more subtle, and if the buttons like "", "" and "preview" looked more like toggle buttons – now they remind me of tabs but disconnected from their sections, and they also draw more attention than is perhaps needed?) Thank you for checking in on this!
Thank you for your feedback.


Question: if (typeof test.remove !== 'function') { return false; } <ins> test.add(15); test.add(30); </ins> return test.remove(100) == null; })() );

<!-- NOTE: If you're reporting a security issue, don't create a GitHub issue. Instead, email We will look into it immediately. --Describe your problem and how to reproduce it: using the code in this file: the challenge is passable by uncommenting lines 56-59 if (curr === null) { (curr, "curr") return null } The wording of the test is "Trying to remove an element that does not exist should return null." yet the assertions only test for removing a node that does not exist in an empty tree. What about removing nodes that do not exist in a tree that has nodes? ` Add a Link to the page with the problem: My pull request: Tell us about your browser and operating system: Browser Name: Browser Version: Operating System: If possible, add a screenshot here (you can drag and drop, png, jpg, gif, etc. in this box):
To summarize the issue: Test checks only if trying to remove non-existing element from empty tree will return null. It doesn't check if the same happens for removing non-existing element from non-empty tree. This can lead to implementation, which doesn't handle the second case at all (and even as in example above can end up with error), and still pass challenge.


Question: Chain the `join()` method to your `map()` method and pass in an empty string for the separator. <ins> To chain multiple methods together, you can call the `join()` method on the result of the `map()` method. For example: ```js array.map().join(); ``` </ins> # --hints-- You should add `join("")` to the existing code.

This step comes up a lot on the forum and I think it is because we have never really explained what method chaining is or showed an example. Let's update the description to include an example so they know what to do. We should also explain why the join method is needed here so they better understand what is going on. js const exampleArr = ["This", "is", "a", "sentence"]; const sentence = (" "); // Separator takes a space character (sentence); // Output: "This is a sentence" js ().join(); ` see explanation above see explanation above No response Device: [e.g. iPhone 6, Laptop] OS: [e.g. iOS 14, Windows 10, Ubuntu 20.04] Browser: [e.g. Chrome, Safari] Version: [e.g. 22] No response
This has been opened for contribution. The first comprehensive PR created will be reviewed and merged. We typically do not assign issues to anyone other than long-time contributors. If you would like to contribute and have not read the contributors docs, please do so here: If you have any issues with contributing, be sure to join us on the , or on the Happy coding


Question: "expect(drawer(19.50, 20.00, [['PENNY', 0.01], ['NICKEL', 0], ['DIME', 0], ['QUARTER', 0], ['ONE', 0], ['FIVE', 0], ['TEN', 0], ['TWENTY', 0], ['ONE HUNDRED', 0]])).to.be.a('string');", "expect(drawer(19.50, 20.00, [['PENNY', 0.50], ['NICKEL', 0], ['DIME', 0], ['QUARTER', 0], ['ONE', 0], ['FIVE', 0], ['TEN', 0], ['TWENTY', 0], ['ONE HUNDRED', 0]])).to.be.a('string');", "assert.deepEqual(drawer(19.50, 20.00, [['PENNY', 1.01], ['NICKEL', 2.05], ['DIME', 3.10], ['QUARTER', 4.25], ['ONE', 90.00], ['FIVE', 55.00], ['TEN', 20.00], ['TWENTY', 60.00], ['ONE HUNDRED', 100.00]]), [['QUARTER', 0.50]], 'return correct change');", <del> "assert.deepEqual(drawer(3.26, 100.00, [['PENNY', 1.01], ['NICKEL', 2.05], ['DIME', 3.10], ['QUARTER', 4.25], ['ONE', 90.00], ['FIVE', 55.00], ['TEN', 20.00], ['TWENTY', 60.00], ['ONE HUNDRED', 100.00]]), [['TWENTY', 80.00], ['TEN', 10.00], ['FIVE', 5], ['ONE', 1], ['QUARTER', 0.50], ['DIME', 0.20], ['PENNY', 0.04] ], 'return correct change with multiple coins and bills');", </del> <ins> "assert.deepEqual(drawer(3.26, 100.00, [['PENNY', 1.01], ['NICKEL', 2.05], ['DIME', 3.10], ['QUARTER', 4.25], ['ONE', 90.00], ['FIVE', 55.00], ['TEN', 20.00], ['TWENTY', 60.00], ['ONE HUNDRED', 100.00]]), [['TWENTY', 60.00], ['TEN', 20.00], ['FIVE', 15], ['ONE', 1], ['QUARTER', 0.50], ['DIME', 0.20], ['PENNY', 0.04] ], 'return correct change with multiple coins and bills');", </ins> "assert.deepEqual(drawer(19.50, 20.00, [['PENNY', 0.01], ['NICKEL', 0], ['DIME', 0], ['QUARTER', 0], ['ONE', 0], ['FIVE', 0], ['TEN', 0], ['TWENTY', 0], ['ONE HUNDRED', 0]]), 'Insufficient Funds', 'insufficient funds');", "assert.deepEqual(drawer(19.50, 20.00, [['PENNY', 0.50], ['NICKEL', 0], ['DIME', 0], ['QUARTER', 0], ['ONE', 0], ['FIVE', 0], ['TEN', 0], ['TWENTY', 0], ['ONE HUNDRED', 0]]), "Closed", 'cash-in-drawer equals change');" ]

In the following test-case expected ['TWENTY', 80.00], but only ['TWENTY', 60.00] available. I'm going to fix it and make a pull request.


Question: You should not call the `changeBackgroundColor` function. Instead, assign the function reference to the `onclick` property. ```js <ins> assert.strictEqual(typeof btn.onclick, 'function'); assert.strictEqual(typeof changeBackgroundColor, 'function'); </ins> assert.strictEqual(btn.onclick, changeBackgroundColor); ```

There is a bug in the challenge learn-basic-debugging-by-building-a-random-background-color-changer/step-8 | when entering it passes the test; ! Device: [MacBook Pro 10.15.7] OS: [ iOS Catalina] Browser: [Brave, Chrome] Version: [...] passes test, when it shouldn't`
Very interesting and confusing finding! This is the passing test: Here's part of the explanation why it passes: Setting to also would pass.


Question: # --description-- <del> Inside `pick`, use `let` to initialize a variable named `numbers` and set it to an empty array. </del> <ins> Inside `pick`, use `const` to initialize a variable named `numbers` and set it to an empty array. </ins> # --hints--

No need to use here since the array is not re-assigned in later steps. We used for other arrays in this project that aren't reassigned. No response All No response
Hello, I fixed this by doing the following: 1) went to 2) found the ID of step-162 () 3) went to the repositories code and searched for the markdown file through ID. 4) the markdown file 5) Updated the markdown file to use 'const' instead of 'let' ! After this commit is approved, this should be able to be closed.
All of the seed code for subsequent challenges would also be changed.
I am not sure what you mean by this. Is there anything I can do to learn this? Are you referring to all references of 'let' initialization to be changed to 'const' in future steps?
Not quite - the answer to this step becomes part of the starting code for all future steps. If we change the instructions to use here, then then starting code on all future steps needs to be swapped to reflect that.
Hi, I raised a PR to fix this


Question: } onReady={this.videoIsReady} opts={{ <del> rel: 0, </del> <ins> playerVars: { rel: 0 }, </ins> width: '960px', height: '540px' }}

We previously attempted this in , which had its own set of issues. We need the Plyr to work natively with Youtube or alternatively make the YouTube embed not show related videos.
Can I work on this ?
I think this is resolved by a recent PR. We are keeping this open for verification. We have lots of other issues open which we could use your help with. Thanks.


Question:
 The sort method sorts the elements of an array according to the callback function. For example:
function ascendingOrder(arr) {
  return arr.sort(function(a, b) {
    return a - b;
  });
}
ascendingOrder([1, 5, 2, 3, 4]);
// Returns [1, 2, 3, 4, 5]

function reverseAlpha(arr) {
  return arr.sort(function(a, b) {
    return a < b;
  });
}
reverseAlpha(['l', 'h', 'z', 'b', 's']);
// Returns ['z', 's', 'l', 'h', 'b']

function ascendingOrder(arr) {
  return arr.sort(function(a, b) {
    return a - b;
  });
}
ascendingOrder([1, 5, 2, 3, 4]);
// Returns [1, 2, 3, 4, 5]

function reverseAlpha(arr) {
  return arr.sort(function(a, b) {
    return a === b ? 0 : a < b ? : 1 : -1;
  });
}
reverseAlpha(['l', 'h', 'z', 'b', 's']);
// Returns ['z', 's', 'l', 'h', 'b']
  Note: It's encouraged to provide a callback function to specify how to sort the array items. JavaScript's default sorting method is by string Unicode point value, which may return unexpected results.

<!-- NOTE: If you're reporting a security issue, don't create a GitHub issue. Instead, email We will look into it immediately. --Describe your problem and how to reproduce it: This challenge has an example of sorting like this: ` This example uses a bad compare function. In recent changes to Chrome the following example no longer properly sorts the array: The compare function needs to return a number to be able to sort an array properly. This can be fixed by changing the compare function to return a number: Add a Link to the page with the problem: Tell us about your browser and operating system: Browser Name: Chrome Browser Version: 70 Operating System: Windows 10
The above return statement only returns 1 or -1. To preserve the original order for elements which have the same value, you need to test for the condition where they are equal. For example, to preserve an elements original order when equal, you would write: While in this particular example, you may not be able to see the difference, I will show a different example below, where the difference can be seen. Let's say you have the following array of objects: The 2nd and fifth elements have the same letter, but they are in different positions. Let's say you want to sort the objects in alphabetical order and preserve the original sort order of the elements with the same letter (in this case those with letter 'b'). This means, after the sort, letters should look like: If you just create the following sort function without specifying a return value of 0 when the letters are equal, it would not sort correctly in the new version of Chrome: The above produces: instead of the correct version: To preserve the original sort order for objects with the same letter, you must use the following sort function: I think the example should reflect the better practice of specifying a return value of 0 for elements which are equal in value. This matches the actual requirements of the compare function of returning a value of 0, -1, or 1, so I believe the example should be written like:
I am interested working on this issue
Although the example used in the original text doesn't require ordering I agree adding would be fine. As much as I like ternaries, I'm not in favor of nested ternaries. As a general rule they . If possible I'd keep the text challenge clean and readable.


Question:
 The sort method sorts the elements of an array according to the callback function. For example:
function ascendingOrder(arr) {
  return arr.sort(function(a, b) {
    return a - b;
  });
}
ascendingOrder([1, 5, 2, 3, 4]);
// Returns [1, 2, 3, 4, 5]

function reverseAlpha(arr) {
  return arr.sort(function(a, b) {
    return a < b;
  });
}
reverseAlpha(['l', 'h', 'z', 'b', 's']);
// Returns ['z', 's', 'l', 'h', 'b']

function ascendingOrder(arr) {
  return arr.sort(function(a, b) {
    return a - b;
  });
}
ascendingOrder([1, 5, 2, 3, 4]);
// Returns [1, 2, 3, 4, 5]

function reverseAlpha(arr) {
  return arr.sort(function(a, b) {
    return a === b ? 0 : a < b ? : 1 : -1;
  });
}
reverseAlpha(['l', 'h', 'z', 'b', 's']);
// Returns ['z', 's', 'l', 'h', 'b']
  Note: It's encouraged to provide a callback function to specify how to sort the array items. JavaScript's default sorting method is by string Unicode point value, which may return unexpected results.

Maybe the good ol' if statements are fine here:
Let's see what says after my last reply, before we assign it to you.
Yeah, even I think it is better to make it in the form of as many people still get confused with nested ternaries.
I would take a different perspective here. For the purposes of the tutorial, I suggest that nested ternaries are the way to go. If people do get confused, this will encourage them to look up their doubt and they will be better versed with ternaries for later. I have opened a PR with the edit implementing nested ternaries.
On second thought, and the fact we already have a nested ternary lesson in basic JS section. I think it's fine to use a nested ternary. Good point as well.
Make sure to reference that it closes this issue # if you have not already done so.
just remember to ask first before you create a PR as there might be other people waiting to do one, like had asked here before if he could work on it? sorry about not getting to do a PR for this issue, there are other issues you might take a look at.
I will take care of this in future PRs. Apologies for my mistake .
Comment on issue
What are these PRs you have referenced?
could be spam.
The sample code on the FCC website is still the old version. I noticed on the challenge's GitHub page the sample code is different than what I saw on the live FCC website. I did this challenge on December 19, 2018. The sample code on the FCC website website is the old version (different from the GitHub version). I thought that the GitHub version of the challenge was reflected on the FCC site. Does this happen at regular intervals, or do updated challenges need to be pushed live to the site? As a side note, the sample code on the GitHub page and the live FCC site doesn't work in Chrome 70+ for reasons addressed above. May I update the sample code to a version that works? In this case, the description would also need updating to explain the code. Should I make the changes as a pull request? Sorry, I'm really new to FCC and Open Source contributing in general. I just want to make sure I do things in the most efficient way.


Question:
 The sort method sorts the elements of an array according to the callback function. For example:
function ascendingOrder(arr) {
  return arr.sort(function(a, b) {
    return a - b;
  });
}
ascendingOrder([1, 5, 2, 3, 4]);
// Returns [1, 2, 3, 4, 5]

function reverseAlpha(arr) {
  return arr.sort(function(a, b) {
    return a < b;
  });
}
reverseAlpha(['l', 'h', 'z', 'b', 's']);
// Returns ['z', 's', 'l', 'h', 'b']

function ascendingOrder(arr) {
  return arr.sort(function(a, b) {
    return a - b;
  });
}
ascendingOrder([1, 5, 2, 3, 4]);
// Returns [1, 2, 3, 4, 5]

function reverseAlpha(arr) {
  return arr.sort(function(a, b) {
    return a === b ? 0 : a < b ? : 1 : -1;
  });
}
reverseAlpha(['l', 'h', 'z', 'b', 's']);
// Returns ['z', 's', 'l', 'h', 'b']
  Note: It's encouraged to provide a callback function to specify how to sort the array items. JavaScript's default sorting method is by string Unicode point value, which may return unexpected results.

I propose the following (the opposite of the reverse alphabetical sort suggested above): The old version that doesn't work in Chrome 70+: Here's the screenshot: ! Here is the link to the GitHub page:
Not sure if I misunderstood you, by "sample code" do you mean the guide? is a PR for the guide, although it seems to be missing the fix for reverseAlpha ascendingOrder version of sort where the compare function is using subtraction is only (to be) used with numbers, not strings. Which is not explained, nor is the function name very explicit about that fact. On a side note: Personally, I would like to see the use of parentheses as I feel it makes the nested ternary more legible. Maybe also a version using (maybe just in the guide) I would also like to see a link to the MDN docs (and maybe a short explanation of how the method and callback works).
RE: Sort an Array Alphabetically using the sort Method Challenge... Maybe not the cleanest but simply running this code: worked in my case :)
Hi I was not referring to the guide, but instead to the live/production and the GitHub version. (Now that you mentioned it, I checked out the PR you linked and noticed that even in the guide, the first example for an ascending sort does not work in Chrome 70+. I'll comment on that PR as well.) Here are screenshots and tables below summarizing the issue. In short, the sample code on the FCC site for ascending sort is an example of how to sort numbers. It works for numbers but does not work when applied to letters/strings in Chrome 70+. The sample code for the reverse alphabetical sort also doesn't work in Chrome 70+ but does in FireFox. I think it would be best to have sample code that applies to the challenge, and works across major browsers. ! ! PASS PASS PASS PASS Note: there is a typo in the second sample code block of the GitHub version screenshot. The PR you linked addresses that as well. Hope this info helps. Please let me know if anything is unclear.
Hi I like the brackets in the nested ternary. This may be minor, but I think a different arrangement of the nested ternary would be even more intuitive and brackets wouldn't really be necessary. I my suggestions as comments to the code blocks below.


Question:
 The sort method sorts the elements of an array according to the callback function. For example:
function ascendingOrder(arr) {
  return arr.sort(function(a, b) {
    return a - b;
  });
}
ascendingOrder([1, 5, 2, 3, 4]);
// Returns [1, 2, 3, 4, 5]

function reverseAlpha(arr) {
  return arr.sort(function(a, b) {
    return a < b;
  });
}
reverseAlpha(['l', 'h', 'z', 'b', 's']);
// Returns ['z', 's', 'l', 'h', 'b']

function ascendingOrder(arr) {
  return arr.sort(function(a, b) {
    return a - b;
  });
}
ascendingOrder([1, 5, 2, 3, 4]);
// Returns [1, 2, 3, 4, 5]

function reverseAlpha(arr) {
  return arr.sort(function(a, b) {
    return a === b ? 0 : a < b ? : 1 : -1;
  });
}
reverseAlpha(['l', 'h', 'z', 'b', 's']);
// Returns ['z', 's', 'l', 'h', 'b']
  Note: It's encouraged to provide a callback function to specify how to sort the array items. JavaScript's default sorting method is by string Unicode point value, which may return unexpected results.

They match the code on the MDN page, which states that the ternary operator is right-associative (details below). What do you think? MDN: Conditional (ternary) operator
The TLDR; The only bug is, Chrome used to accept boolean return values like Firefox still does. After Chrome changed their sort it no longer does. This is not a bug in Chrome, but incorrect usage of the compare function in the assignment text, this has now been fixed (site is not updated yet). The comparefn is supposed to return numeric values: 0 (a must be equal to b) 1 (a is greater than b by the ordering criterion) -1 (a is less than b by some ordering criterion) If the comparefn does not return numeric values it is not consistent and the sort order is implementation-defined (which is spec compliant). ascendingOrder (return a - b) version is not meant to work with strings, in any browser. It is an example of using a compare function for sorting an array of numbers using subtraction. You seem to be mixing the number (ascendingOrder) and string versions (alphabeticalOrder/reverseAlpha), not sure why. Your screenshot and table are confusing and as far as I can tell must be wrong. The screenshot shows Chrome failing to sort an array of numbers, using ascendingOrder, which is incorrect. Then your table shows Firefox passing on an array of strings, using ascendingOrder, which it does not. For both browsers, using ascendingOrder on an array of numbers sorts the array correctly. Using ascendingOrder in Chrome on an array of strings leaves the array unchanged. Using ascendingOrder in Firefox on an array of strings reverses the array but does not sort it. Just to be clear, ascendingOrder is meant to sort the array, not reverse it. It just happens to be shown in the example text on an array of numbers that is in reverse order and so sorting the array effectively reverses it. can't put the alphabeticalOrder version in the assignment text, that is the solution to the assignment. That is why I asked. deeply nested ternaries your last style example is pretty common, however, for what we have in the assignment I think a single line expression is better. My format suggestion is based on how prettier formats the code.


Question:
 The sort method sorts the elements of an array according to the callback function. For example:
function ascendingOrder(arr) {
  return arr.sort(function(a, b) {
    return a - b;
  });
}
ascendingOrder([1, 5, 2, 3, 4]);
// Returns [1, 2, 3, 4, 5]

function reverseAlpha(arr) {
  return arr.sort(function(a, b) {
    return a < b;
  });
}
reverseAlpha(['l', 'h', 'z', 'b', 's']);
// Returns ['z', 's', 'l', 'h', 'b']

function ascendingOrder(arr) {
  return arr.sort(function(a, b) {
    return a - b;
  });
}
ascendingOrder([1, 5, 2, 3, 4]);
// Returns [1, 2, 3, 4, 5]

function reverseAlpha(arr) {
  return arr.sort(function(a, b) {
    return a === b ? 0 : a < b ? : 1 : -1;
  });
}
reverseAlpha(['l', 'h', 'z', 'b', 's']);
// Returns ['z', 's', 'l', 'h', 'b']
  Note: It's encouraged to provide a callback function to specify how to sort the array items. JavaScript's default sorting method is by string Unicode point value, which may return unexpected results.

Last I'm not sure if this conversation on a closed issue is considered proper etiquette or not, I simply don't have enough experience.
The above analysis is spot on. Thank you for the great explanation and its fine to have a discussion in a closed issue as long as its on topic. Otherwise you can always create new issue.
function alphabeticalOrder(arr) { return ((a, b) =a !== b ? (a < b ? -1 : 1) : 0); }


Question: 1. When you click on the `#check-btn` element without entering a value into the `#text-input` element, an alert should appear with the text `Please input a value` 1. When the `#text-input` element only contains the letter `A` and the `#check-btn` element is clicked, the `#result` element should contain the text `A is a palindrome` 1. When the `#text-input` element contains the text `eye` and the `#check-btn` element is clicked, the `#result` element should contain the text `eye is a palindrome` <del> 1. When the `#text-input` element contains the text `_eye` and the `#check-btn` element is clicked, the `#result` element should contain the text `eye is a palindrome` </del> <ins> 1. When the `#text-input` element contains the text `_eye` and the `#check-btn` element is clicked, the `#result` element should contain the text `_eye is a palindrome` </ins> 1. When the `#text-input` element contains the text `race car` and the `#check-btn` element is clicked, the `#result` element should contain the text `race car is a palindrome` 1. When the `#text-input` element contains the text `not a palindrome` and the `#check-btn` element is clicked, the `#result` element should contain the text `not a palindrome is not a palindrome` 1. When the `#test-input` element contains the text `A man, a plan, a canal. Panama` and the `#check-btn` element is clicked, the `#result` element should contain the text `A man, a plan, a canal. Panama is a palindrome`

Point 7. of instruction says: There is missing underscore near eye in the result text. The correct solution for this test is text: eye is a palindrome (with underscore) Instruction text at Point 7. changed to: ! Device: [e.g. iPhone 6, Laptop] OS: [e.g. iOS 14, Windows 10, Ubuntu 20.04] Browser: [e.g. Chrome, Safari] Version: [e.g. 22] No response
The result looks correct to me because the instructions have this note in the beginning If we remove all special characters from then we would be left with
Look at the instructions for tests 16 and 17. The string includes all of the non-alphanumeric characters. But for test 7 the underscore is left out of the string.
I see it now. I misread that as returning the string without non-alphanumeric characters. In addition to updating the test description the hint text will also need to be updated This is has been opened for contribution. The first comprehensive PR created will be reviewed and merged. We typically do not assign issues to anyone other than long-time contributors. If you would like to contribute and have not read the contributors docs, please do so here: If you have any issues with contributing, be sure to join us on the , or on the User story 7 will need to be updated and the hint text here will need to be updated


Question: </div> <div class="spacer" <del> style="padding: 15px 0px; height: 1px;" </del> <ins> style="padding: 15px 0px;" </ins> /> </div> </div>

We have instances which is used to provide spacing for both side of the component to wrap it up in specific space Example: We can make the Spacer component smarter, and allow it to accept children, so the code be like. But in doing so, we need to: change the current values and how the padding is calculated, the old layout shouldn't change with the new spacers. change which padding has the new value, I think paddingBlock, which is paddingTop and paddingBottom, is the new padding property . I am requesting this because this will make live simpler, and we have to worry about less elements while controling the layout, and if we have specific cases, we can still use
There is an abstraction with , we need address, it's better if we can specify the direction of the padding. but this can be sorted in another issue, for now to solve this issue please allow to have children prop inside of it, but the current styles of the curriculum shouldn't change. If you would like to fix this issue, please make sure you read , we prioritize contributors following the instructions in our guides. Join us in or if you need help contributing, our prolific contributors will guide you through this.
Hey I have few questions while looking into this issue are few files where we have used Spacer, so may I just change wrap the content where ever needed or it would be handled in new issue? (I guess it must be done in other issue, as it would be easy to maintain) have implemented the children props, so may I raise a PR? Will break this issue in 2 other issues as well. 1 for wrapping the places it has been used, and 2nd for specifying the direction. I was wrapping and trying it out, I found out that Spacer has been used at every 2nd-3rd line of code, so do we need such a wrapper which would give spacing to all components present inside it or only to the parent component? EG: If we have 2 divs wrapped inside Spacer, then does both div have the spacing around them or only the outmost div.


Question: </div> <div class="spacer" <del> style="padding: 15px 0px; height: 1px;" </del> <ins> style="padding: 15px 0px;" </ins> /> </div> </div>

sorry for the delay, it was difficult to understand what you mean without looking at an example of code, so to answer you: yes the direction will be in a second issue, but the spacing and values should still be in this issue, so the pages won't look different Of course, please raise a PR after reading the guideline, nicely done . The Spacer shouldn't affect the children inside of it, think of it as creating a container with margin-block to space the area of the children inside of it from other areas
I guess we could close this issue
will be closed when the height is removed in the other PR


Question: # --description-- <del> Inside your `while` loop, push a random number between 0 and 10 to the end of the `numbers` array. You can create this random number with `Math.floor(Math.random() * 11)`. </del> <ins> Inside your `while` loop, push a random number between `0` and `10` to the end of the `numbers` array. You can create this random number with `Math.floor(Math.random() * 11)`. </ins> # --hints--

All numbers for descriptions should be in backticks. Here is the updated description Here is the file you will need to change Please make sure you read our , we prioritize contributors following the instructions in our guides. Join us in our or our if you need help contributing; our moderators will guide you through this. Sometimes we may get more than one pull request. We typically accept the most quality contribution followed by the one that is made first. Happy contributing. see explanation above see explanation above No response Device: [e.g. iPhone 6, Laptop] OS: [e.g. iOS 14, Windows 10, Ubuntu 20.04] Browser: [e.g. Chrome, Safari] Version: [e.g. 22] No response
id like to pick up this, can you assign it to me pls
We do not assign issues to anyone other than long-time contributors and core team members. This issue is free to pick up for anyone interested in working on it. If you would like to contribute and have not read the contributors docs, please do so here: If you have any issues with contributing, be sure to join us on the , or on the


Question: `Thermostat` should be a `class` with a defined `constructor` method. ```js <del> assert( typeof Thermostat === 'function' && typeof Thermostat.constructor === 'function' ); </del> <ins> assert.isFunction(Thermostat); assert.isFunction(Thermostat?.constructor); </ins> ``` <del> `class` keyword should be used. </del> <ins> The `class` keyword should be used. </ins> ```js <del> assert(code.match(/class/g)); </del> <ins> assert.match(code, /class/); </ins> ``` `Thermostat` should be able to be instantiated. ```js <del> assert( (() => { const t = new Thermostat(122); return typeof t === 'object'; })() ); </del> <ins> const _t = new Thermostat(122); assert.isObject(_t); </ins> ``` When instantiated with a Fahrenheit value, `Thermostat` should set the correct `temperature`. ```js <del> assert( (() => { const t = new Thermostat(122); return t.temperature === 50; })() ); </del> <ins> const _t = new Thermostat(122); assert.strictEqual(_t?.temperature, 50); </ins> ``` A `getter` should be defined. ```js <del> assert( (() => { const desc = Object.getOwnPropertyDescriptor( Thermostat.prototype, 'temperature' ); return !!desc && typeof desc.get === 'function'; })() ); </del> <ins> const _desc = Object.getOwnPropertyDescriptor(Thermostat.prototype, 'temperature'); assert.isFunction(_desc?.get); </ins> ``` A `setter` should be defined. ```js <del> assert( (() => { const desc = Object.getOwnPropertyDescriptor( Thermostat.prototype, 'temperature' ); return !!desc && typeof desc.set === 'function'; })() ); </del> <ins> const _desc = Object.getOwnPropertyDescriptor(Thermostat.prototype, 'temperature'); assert.isFunction(_desc?.set); </ins> ``` Calling the `setter` with a Celsius value should set the `temperature`. ```js <del> assert( (() => { const t = new Thermostat(32); t.temperature = 26; const u = new Thermostat(32); u.temperature = 50; return t.temperature === 26 && u.temperature === 50; })() ); </del> <ins> const _t = new Thermostat(32); _t.temperature = 26; const _u = new Thermostat(32); _u.temperature = 50; assert.approximately(_t.temperature, 26, 0.1); assert.approximately(_u.temperature, 50, 0.1); </ins> ``` # --seed--

The formula given for converting from C to F is given as a) But this can also be written as b) These two formulas are producing different results. Using for (which is used in the tests) we get: a) b) If formula is used then the tests for this challenge will fail due to the floating point rounding issue. The tests should pass regardless of where C is placed in the formula. Either we need to do a little rounding in the tests or replace with a different number in the tests that won't produce different results depending on the placement of C in the formula. No response Device: Desktop OS: Linux/Fedora 36 Browser: Firefox Version: 112 No response


Question: # --description-- <del> Add a `title` and a `meta` element to the `head`. Give your project a title of `Registration Form`, and give a `charset` attribute with a value of `UTF-8` to your `meta` element. </del> <ins> Add a `title` and `meta` element inside the `head` element. Give your project a title of `Registration Form`, and add the `charset` attribute with a value of `utf-8` to your `meta` element. </ins> # --hints--

I followed Step 4 instructions. As I finished typing out the element, by habit I press + , and noticed that it accepted it, even though it shouldn't have as I was still missing the element It should have failed, as it's still missing the that Step 4 asked for ! Device: PC OS: Window 11 Version 23H2 Browser: Firefox 127.0.2 (64-bit) No response
This seem to also happen in other parts of the same course, such as Step 7 ! As you can see, it is missing its closing tag As well as Step 11 ! It's missing its closing tag yet the Step still validate it
Can you please open a new issue for the form element. I'm guessing the browser is auto closing it, and we don't have a regex test for it. It should result in a valid form element, because the browser will close it. However, the element technically does not have any "Tag omission" so it should have an end tag in the HTML (even if it gets to the DOM by the browser).
Done


Question: > <Caret /> <h4> <del> Super Block One Certification (300 hours) </del> <ins> Super Block One Certification (300 hours) </ins> </h4> </button> </li>

Currently the map looks like this: ! I think it would look a lot better if we made more use of the available space. Something like this: !
I can fix the css in a separate PR, if you like. Unless you're already handling it, of course.
I think it is handled now in the PR already. I moved things into the Grid system
That PR still has the heavy indentation: !
You are correct, if you have something going please go ahead and push to the PR. I am done with the basic consolidation of the views that I was going for.


Question:
## Instructions
 Write a remove method that takes an element and removes it from the linked list.  Note The length of the list should decrease by one every time an element is removed from the linked list.   Note: The length of the list should decrease by one every time an element is removed from the linked list.
 ## Tests

Following the conventions decided upon in , we should change the instruction in the "Remove Elements from a Linked List" challenge - to Add a Link to the page with the problem: The file to be changed is . Since this is a simple change, we would welcome Pull Requests from first time contributors.
I can do it. Should i make the same change in the portuguese version too?
No, just make the change for the English version.


Question: ```js function whatIsInAName(collection, source) { <del> const arr = []; // Only change code below this line // Only change code above this line return arr; </del> } whatIsInAName([{ first: "Romeo", last: "Montague" }, { first: "Mercutio", last: null }, { first: "Tybalt", last: "Capulet" }], { last: "Capulet" });

The declaration of arr doesn’t need to be guarded by ‘Do Not Change’ comments. There exist many solutions (3 in the guide) that do not need that variable declaration. These comments should be removed or at least moved. All No response
. I lean towards the second option of having only the comments within the function and no extra starter code.
I was thinking something simplier We've ditched a lot of these comments in the rest of the intermediate algorithm challenges. Does the comment help us at all here?
Probably not. I honestly would not even put the . At this point in the curriculum, users should know the function needs to have a statement and they can craft their own.
Sure, then the fix would be: This looks like a good first-timer issue.
Thanks for opening this issue. This looks like something that can be fixed by "first-time" code contributors to this repository. Here are the files that you should be looking at to work on a fix: List of files: Please make sure you read our , we prioritize contributors following the instructions in our guides. Join us in our or our if you need help contributing; our moderators will guide you through this. Sometimes we may get more than one pull request. We typically accept the most quality contribution followed by the one that is made first. Happy contributing.


Question: # --description-- <del> Add one last conditional statement that checks if the player's `x` position is less than or equal to the sum of the platform's `x` position plus the platform's width minus one-third of the player's width. </del> <ins> Add one last boolean expression that checks if the player's `x` position is less than or equal to the sum of the platform's `x` position plus the platform's width minus one-third of the player's width. </ins> # --hints-- <del> You should have a conditional statement that checks if the player's `x` position is lesser than or equal to the platform's `x` position plus the platform's width minus the player's width divided by `3`. </del> <ins> You should have a boolean expression that checks if the player's `x` position is lesser than or equal to the platform's `x` position plus the platform's width minus the player's width divided by `3`. </ins> ```js assert.match(code, /player.position.xs*<=s*platform.position.xs*+s*platform.widths*-s*player.widths*/s*3,?/)

The instructions are really confusing and could be rephrased. ! I don't think what is referred to as a conditional is a what people are going to think of as a conditional. It is just a Boolean expression that is being asked for. No action or assignment is being given depending on truthiness of the expression. It seems like it is looking for an if, switch, ternary or bare conditional, and I believe only ternary or a bare conditional can be placed inside of an array (Not being nested inside of IIFE) which is knowledge a novice probably won't have. The difference, although small, is that a condition takes an action based on the result of a Boolean expression. No conditional action is being taken, so it is just an expression. Might ask for the first element in the array to be a Boolean expression of the sum of the player's position, height and velocity greater than or equal to the platform's position. There are various steps that follow that refer to Boolean expressions as conditionals. The concern is people learning incorrect terminology and getting mixed up in the field.
Yes, you are correct we should update the terminology for steps 78-81 to say boolean expression instead of conditional statement. I have opened this up for contribution.
For each of the steps, make sure to make the change mentioned above in all of the descriptions. Also, go through and check all of the hint text to make sure the correct terminology is used as well
It is bigger than a few steps. I did not track all the steps but kept seeing it through to the end of the course. It happens everywhere that we later do conditional action based on the Booleans stored in arrays. For each array we made, (I think there were 3? player, platform and checkpoints), the instructions use the same wording.
Looks like we have a PR to address the few steps I mentioned earlier. We can review that and merge it in which will close this particular issue. But then I can audit the project to find the other steps and create a second PR to remove the rest
Did a search and replace for the english files and found five more files total where the change needed to be applied. Here is the PR to resolve that.


Question: # --seed-- <ins> ## --after-user-code-- ```js let rules=[["A -> apple","B -> bag","S -> shop","T -> the","the shop -> my brother","a never used -> .terminating rule"], ["A -> apple","B -> bag","S -> .shop","T -> the","the shop -> my brother","a never used -> .terminating rule"], ["A -> apple","WWWW -> with","Bgage -> ->.*","B -> bag","->.* -> money","W -> WW","S -> .shop","T -> the","the shop -> my brother","a never used -> .terminating rule"], ["_+1 -> _1+","1+1 -> 11+","1! -> !1",",! -> !+","_! -> _","1*1 -> x,@y","1x -> xX","X, -> 1,1","X1 -> 1X","_x -> _X",",x -> ,X","y1 -> 1y","y_ -> _","1@1 -> x,@y","1@_ -> @_",",@_ -> !_","++ -> +","_1 -> 1","1+_ -> 1","_+_ -> "], ["A0 -> 1B","0A1 -> C01","1A1 -> C11","0B0 -> A01","1B0 -> A11","B1 -> 1B","0C0 -> B01","1C0 -> B11","0C1 -> H01","1C1 -> H11"]]; let tests=["I bought a B of As from T S.", "I bought a B of As from T S.", "I bought a B of As W my Bgage from T S.", "_1111*11111_", "000000A000000"]; let outputs=["I bought a bag of apples from my brother.", "I bought a bag of apples from T shop.", "I bought a bag of apples with my money from T shop.", "11111111111111111111", "00011H1111000"] ``` </ins> ## --seed-contents-- ```js

Describe your problem and how to reproduce it: Data with test cases is in wrong place in challenge template. This makes it inaccessible when tests are run and makes challenge virtually unsolvable, unless test data is manually copied to the user code. Tests in this challenge uses three arrays, containing two inputs for the function and function outcome - arrays , , . They are called this way: Those variables are currently at the end of sample solution in challenge template. Simple moving them to more appropriate place - or section in the section - as shown in the , would deal with the issue. Add a Link to the page with the problem:


Question: # --description--  **Objective:** Build an app that is functionally similar to this: https://codepen.io/freeCodeCamp/full/JEXgeY.   **Objective:** Build an app that is functionally similar to this: https://heat-map.freecodecamp.rocks.  Fulfill the below user stories and get all of the tests to pass. Use whichever libraries or APIs you need. Give it your own personal style.

All the data viz projects were created on our .rocks domain. We just need to replace the codepen URL's with the new addresses in the curriculum files of those five projects. Here's the URL's: https://bar- https://scatterplot- https://heat- https://choropleth- https://treemap- And the
Hey Just to make sure you want this replaced with https://bar- ?
I want to contribute to this project. Please assign me this task.
thank you for your interested in contributing, but this issue is not open for contributions, please look at issues with labels or


Question: # --description-- <del> Use the `setAttribute` method on the `playButton` element to set an attribute named `"aria-label"`. For the value, use a `ternary` to set `song?.title` to `Play ${song.title}` or `"Play"` if there's no `song.title` available. </del> <ins> The `setPlayButtonAccessibleText` function will set the `aria-label` attribute to the current song, or to the first song in the playlist. And if the playlist is empty, it sets the `aria-label` to `"Play"`. Use the `setAttribute` method on the `playButton` element to set an attribute named `"aria-label"`. For the value, use a ternary to `set song?.title` to `Play ${song.title}` or `"Play"` if there's no `song.title` available. </ins> Don't forget you need template interpolation here, so you need to use backticks.

I would suggest removing the second paragraph for step 66 (as a quite novice coder I guess the wording caught me up and I thought the challenge would lean on the side of more difficult rather than easy). I re-read it quite a few times but didn't realize that it was just explaining a later step. It took me a bit of time until I realized that only the first paragraph was needed to solve the solution. I just have an issue with the wording. Nothing else. Sorry if I did something wrong. This is my first time submitting an issue request No response Device: Desktop OS: Windows Browser: Chrome Version: 10 Just had issues with the wording and was recommending it being changed. Sorry if I did something wrong. This is my first github issue request
It looks like the original intent was to describe what the function was going to be about. I think removing it all together would leave the step in a place where campers are just asked to create a new function with no clue as to why or what it does. It would be better to provide some explanation on what they will be doing in the next few steps. A rewording would be better. Something like could work I'll open it up for discussion by the other maintainers to hear thoughts on wording. You didn't do anything wrong. It is a good issue
I am going to go ahead and open this up for contribution


Question: import rateLimit from 'express-rate-limit'; // @ts-expect-error - no types import MongoStoreRL from 'rate-limit-mongo'; <ins> import isEmail from 'validator/lib/isEmail'; </ins> import { AUTH0_DOMAIN, MONGOHQ_URL } from '../utils/env'; import { auth0Client } from '../plugins/auth0'; <ins> import { createAccessToken } from '../utils/tokens'; </ins> import { findOrCreateUser } from './helpers/auth-helpers'; <del> const getEmailFromAuth0 = async (req: FastifyRequest) => { </del> <ins> const getEmailFromAuth0 = async ( req: FastifyRequest ): Promise<string | null> => { </ins> const auth0Res = await fetch(`https://${AUTH0_DOMAIN}/userinfo`, { headers: { Authorization: req.headers.authorization ?? '' } }); <del> if (!auth0Res.ok) { req.log.error(auth0Res); throw new Error('Invalid Auth0 Access Token'); } </del> <ins> if (!auth0Res.ok) return null; </ins> <del> const { email } = (await auth0Res.json()) as { email: string }; return email; </del> <ins> // For now, we assume the response is a JSON object. If not, we can't proceed // and the only safe thing to do is to throw. const { email } = (await auth0Res.json()) as { email?: string }; return typeof email === 'string' ? email : null; </ins> }; /**

This endpoint needs to use jwtaccesstoken in the same way that web login does.


Question: align-items: center; min-height: 100vh; flex-direction: column; <ins> padding: 50px; </ins> } .certificate-outer-wrapper .donation-section { <del> padding: 20px 0px; </del> <ins> padding-bottom: 100px; </ins> } .certificate-outer-wrapper .donation-section hr {

Is your feature request related to a problem? Please describe. Currently the certificates lack any white space along the top border, making them difficult to screenshot and/or print: ! We should add some white space to the top of the page so the certificate is centered.


Question: --fcc-editable-region-- function pick(guess) { <del> let numbers = []; </del> <ins> const numbers = []; </ins> while (numbers.length < 10) { }

No need to use here since the array is not re-assigned in later steps. We used for other arrays in this project that aren't reassigned. No response All No response
Hello, I fixed this by doing the following: 1) went to 2) found the ID of step-162 () 3) went to the repositories code and searched for the markdown file through ID. 4) the markdown file 5) Updated the markdown file to use 'const' instead of 'let' ! After this commit is approved, this should be able to be closed.
All of the seed code for subsequent challenges would also be changed.
I am not sure what you mean by this. Is there anything I can do to learn this? Are you referring to all references of 'let' initialization to be changed to 'const' in future steps?
Not quite - the answer to this step becomes part of the starting code for all future steps. If we change the instructions to use here, then then starting code on all future steps needs to be swapped to reflect that.
Hi, I raised a PR to fix this


Question: ? 'vs-custom' : editorSystemTheme; <del> const isFailedChallengeTest = (test: Test): test is ChallengeTest => !!test.err && 'text' in test; const firstFailedTest = props.tests.find<ChallengeTest>(test => isFailedChallengeTest(test) ); </del> <ins> const firstFailedTest = props.tests.find(test => !!test.err); </ins> return ( <Suspense fallback={<Loader loaderDelay={600} />}>

and are not being replaced by their values in hints: ! While in the console the actual and expected values are visible: ! To reproduce, go to any challenge that uses and/or :
Happening for me in hints for step 76:
Thank you for mentioning, but the fix has not been deployed yet.


Question:
} const Spacer = ({ size, children }: SpacerProps): JSX.Element => (  <div className='spacer' style={{ padding: `${Padding[size]}px 0`, height: '1px' }} >   <div className='spacer' style={{ padding: `${Padding[size]}px 0` }}>  {children}
 );


Question:
} const Spacer = ({ size, children }: SpacerProps): JSX.Element => (  <div className='spacer' style={{ padding: `${Padding[size]}px 0`, height: '1px' }} >   <div className='spacer' style={{ padding: `${Padding[size]}px 0` }}>  {children}
 );


Question: type Story = StoryObj<typeof CloseButton>; export const Basic: Story = { <del> args: { className: '', label: '' } </del> <ins> args: {} </ins> }; export default story;

I got a mini heart attack as I randomly tested the Storybook page of the component and found that the component failed a11y checks. <img width="1680" alt="Screenshot 2024-03-06 at 00 49 32" src=""This is because: We pass as an empty string to the component in the Storybook demo: We use the operator in the computation of the button's label, which would only fall back to if is either or : Note that this issue is only in Storybook and not in /learn as we do pass a to there: In , replace the operator with the operator In , make an empty object instead of containing empty and
I do not care much about the implementation, BUT, surely if a label of is never valid, then it is best to make the optional, and not pass one to the component? That is, I can imagine passing to a component because I do not want one, but was forced to pass one because it is not optional.
For this particular component, I agree that can be optional or can even be removed as a configuration option, since I don't think we need any customization here (the button's label should just be "Close" rather than something else). In fact, is already an optional prop of . However, has a limitation, which is that the library is not localized, so we still want to pass strings from /learn in order to have them translated. Semi-related, there was a discussion a while back regarding whether or not we should expose for consumption outside of . We decided to export the component because: The component in doesn't have a close button, but its version in /learn (which is called ) has one, so was built. (I wasn't around during the development of most of the components so I don't have the full context of the technical design) The limitation mentioned above.


Question: on: workflow_dispatch: schedule: <del> # runs every weekday at 12:15 PM UTC - cron: '15 12 * * 1-5' </del> <ins> # runs Monday and Wednesday at 12:15 PM UTC - cron: '15 12 * * 1,3' </ins> env: GITHUB_TOKEN: ${{ secrets.CROWDIN_CAMPERBOT_PAT }}

Uploads: Everyday Downloads: Twice a week This should suffice our deployment targets which are usually Tuesdays? and Thursdays (optional) at around UTC+3 We can shake it up so that PRs can be merged on Mondays and Wednesdays?
So downloads should be triggered on Mondays and Wednesdays?
Yes, or a day before, for all we care. As long as they are: a week only on Mondays and Wednesdays for deployments on Tuesdays and Thursdays


Question: if (!codeUri.enabled) { return null; } <del> location.hash = '?solution=' + codeUri.encode(encodeFcc(solution)); </del> <ins> if (history && typeof history.replaceState === 'function') { history.replaceState( history.state, null, '?solution=' + codeUri.encode(encodeFcc(solution)) ); } else { location.hash = '?solution=' + codeUri.encode(encodeFcc(solution)); } </ins> return solution; },

Since the code is included in the URL after every change, once the user has made any code changes the back button will not work as expected as the browser history gets filled up with entries pointing to the same page but with different code in the URL. !


Question: padding-bottom: 18px; background: transparent; border: none; <ins> text-align: left; </ins> } button.map-title:hover {


Question: const searchButton = document.getElementById('search-button'); let alertMessage; window.alert = (message) => alertMessage = message; // Override alert and store message <del> const letters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz' const numbers = '0123456789'; const charactersLength = letters.length; const numbersLength = numbers.length; const firstLetter = letters.charAt(Math.floor(Math.random() * charactersLength)); const secondLetter = letters.charAt(Math.floor(Math.random() * charactersLength)); const thirdLetter = letters.charAt(Math.floor(Math.random() * charactersLength)); const fourthLetter = letters.charAt(Math.floor(Math.random() * charactersLength)); const randomNumber1 = numbers.charAt(Math.floor(Math.random() * numbersLength)); const randomNumber2 = numbers.charAt(Math.floor(Math.random() * numbersLength)); const badName = firstLetter + secondLetter + thirdLetter + fourthLetter + randomNumber1 + randomNumber2; const randomInvalidPokeId = badName; </del> <ins> const randomInvalidPokeId = crypto.randomUUID().substring(0, 6); </ins> searchInput.value = randomInvalidPokeId; searchInput.dispatchEvent(new Event('change')); searchButton.click(); <del> const res = await fetch('https://pokeapi-proxy.freecodecamp.rocks/api/pokemon/' + randomInvalidPokeId.toString()); // Fetch from proxy to simulate network delay </del> <ins> const res = await fetch('https://pokeapi-proxy.freecodecamp.rocks/api/pokemon/' + randomInvalidPokeId); // Fetch from proxy to simulate network delay </ins> if (!res.ok) { <del> await new Promise(resolve => setTimeout(resolve, 1000)); // Additional delay to allow the alert to trigger </del> <ins> await new Promise(resolve => setTimeout(resolve, 2000)); // Additional delay to allow the alert to trigger </ins> assert.include(['pokémon not found', 'pokemon not found'], alertMessage.trim().replace(/[.,?!]+$/g, '').toLowerCase()); }

There's typo in two hints. Instead of element it mentions . - - This is something that can be fixed by "first time" code contributors to this repository. Here are the files that you should be looking at to work on a fix: List of files: Please make sure you read , we prioritize contributors following the instructions in our guides. Join us in or if you need help contributing, our moderators will guide you through this. Sometimes we may get more than one pull requests. We typically accept the most quality contribution followed by the one that is made first. Happy contributing.
I was making a PR for a different issue and saw this, so I the fix to the PR.


Question: "cert-map-estimates": { "certs": "认证（300 小时）", "coding-prep": "（数千小时的挑战）" <ins> }, "editor-tabs": { "info": "信息", "code": "码", "tests": "测验", "preview": "预习" </ins> } }, "donate": {

Describe the bug When you enter a challenge using a mobile device, the tabs below the main header are displayed with untranslated text To Reproduce Steps to reproduce the behavior (mobile device): to untranslated tabs below the main header Expected behavior Tabs text should be translated. Screenshots Spanish site ! Chinese site ! Desktop (please complete the following information): OS: [Windows 10] Browser: [chrome] Version: [88] Additional context Those strings are not available yet on the Crowdin platform.


Question: ], "tests": [ "assert(typeof timesFive === 'function', 'message: timesFive should be a function');",  "assert(code.match(/timesFive(s*d+s*)/g), 'message: function timesFive should be called with a number');",   "assert(code.match(/timesFive(s*d+s*)/g), 'message: function timesFive should be called with a number');",  "assert(timesFive(5) === 25, 'message: timesFive(5) should return 25');", "assert(timesFive(2) === 10, 'message: timesFive(2) should return 10');", "assert(timesFive(0) === 0, 'message: timesFive(0) should return 0');"

According to Google Analytics, the is way too hard, and is taking campers an average of 6 minutes and 35 seconds to finish (if they finish - a lot of them seem to give up). According to this table, campers spend more time on it than they do on the algorithm challenges. ! We need to either reword this or simplify the challenge so it can be completed in closer to 3 minutes. Otherwise, we should move it back to the algorithm section.
This challenge does have a large amount of constant strings which could cause users to take a longer time than a typical challenge. Maybe we could provide an array of the responses in the seed code. Make the seed code: This could help in two ways. The first is the users can save time by not having to type out each response. The second is this approach could minimize errors from typos in the response phrases (i.e. Hole-in-one! vs. Hole in one!). We could remove the number of different responses. Maybe remove Eagle and Double Bogey.
yes - that is a great suggestion. I think leaving all the names is fine but we should pre-populate the array with the names. Since this was your suggestion, would you be interested in tackling this and submitting a PR?
Yes, I would like to tackle this and submit a PR.
The Golf Code challenge did take me longer that the other challenges. I did not initially realize that golfScore() had BOTH strokes and par as parameters. With the other IF ELSE challenges we were only dealing with one argument to pass into the IF ELSE condition. I found myself in that "flow" and completely overlooked that two parameters were available to work with in the IF ELSE condition. I also found myself looking at the Strokes/Par table thinking, "How will IF( <= par-2) work?" After a little head scratching, I realized the values under the Strokes column were what you were supposed to compare Strokes to (i.e. IF (strokes <= par-2)). Hopefully, this feedback is helpful. I think the confusion is coming from the wording of the challenge and suddenly going from using one passed in parameter to two in your IF ELSE condition.
Awesome. has a PR open already. Could you take a look at that first and let me know what you think of his proposed changes?


Question: ], "tests": [ "assert(typeof timesFive === 'function', 'message: timesFive should be a function');",  "assert(code.match(/timesFive(s*d+s*)/g), 'message: function timesFive should be called with a number');",   "assert(code.match(/timesFive(s*d+s*)/g), 'message: function timesFive should be called with a number');",  "assert(timesFive(5) === 25, 'message: timesFive(5) should return 25');", "assert(timesFive(2) === 10, 'message: timesFive(2) should return 10');", "assert(timesFive(0) === 0, 'message: timesFive(0) should return 0');"

I agree with MiloATH's proposed changes. Would definitely reduce the potential for typos when working the problem. As a side note, feel free to let me know if I am breaking any GitHub etiquette at any point. Zero experience providing input on collaborative projects. Looking for to learning and have really enjoyed FreeCodeCamp thus far. You guys and gals are doing awesome work. :)
Sure - we will let you know in a polite way if you break GitHub etiquette. Thanks for being receptive to feedback :)


Question: } .map-challenge-title { <ins> display: flex; </ins> margin-bottom: 0.25rem; <del> max-width: calc(100% - 80px); </del> <ins> max-width: calc(100% - 105px); } @media (max-width: 640px) { .map-ui .block ul { padding-inline-start: 6px; font-size: 0.9rem; } button.map-title { width: 100%; } .map-ui ul { padding-inline-start: 15px; } .map-ui > ul { padding-inline-start: 0; } .map-challenge-title { max-width: 100%; } .map-title-completed { flex-shrink: 0; padding-left: 15px; } </ins> } .block a { text-decoration: none; } <ins> /* 14px is the width of the expansion arrow */ .superblock { max-width: calc(100% - 14px); } </ins>

Currently the map looks like this: ! I think it would look a lot better if we made more use of the available space. Something like this: !
I can fix the css in a separate PR, if you like. Unless you're already handling it, of course.
I think it is handled now in the PR already. I moved things into the Grid system
That PR still has the heavy indentation: !
You are correct, if you have something going please go ahead and push to the PR. I am done with the basic consolidation of the views that I was going for.


Question: on: workflow_dispatch: schedule: <del> # runs every weekday at 12:30 PM UTC - cron: '30 12 * * 1-5' </del> <ins> # runs Monday and Wednesday at 12:15 PM UTC - cron: '15 12 * * 1,3' </ins> env: GITHUB_TOKEN: ${{ secrets.CROWDIN_CAMPERBOT_PAT }}


Question: } = this.props; return ( <Hotkeys <ins> editorRef={this.editorRef} </ins> executeChallenge={executeChallenge} innerRef={this.containerRef} introPath={introPath}

Is your feature request related to a problem? Please describe. It currently can take a several key presses to navigate to the editor if it does not have focus. Describe the solution you'd like It should be possible to focus on the editor with a hotkey, for example 'e'. The issue where this was mostly discussed will be closed soon, but some thoughts about implementing this appeared there:


Question: # --description-- <del> Below that conditional statement, add another conditional statement that checks if the player's `x` position is greater than or equal to the platform's `x` position minus half of the player's width. </del> <ins> Below that boolean expression, add another boolean expression that checks if the player's `x` position is greater than or equal to the platform's `x` position minus half of the player's width. </ins> # --hints-- <del> You should have a conditional statement that checks if the player's `x` position is greater than or equal to the platform's `x` position minus half of the player's width. </del> <ins> You should have a boolean expression that checks if the player's `x` position is greater than or equal to the platform's `x` position minus half of the player's width. </ins> ```js assert.match(code, /consts+collisionDetectionRuless*=s*[s*player.position.ys*+s*player.heights*<=s*platform.position.ys*,s*player.position.ys*+s*player.heights*+s*player.velocity.ys*>=s*platform.position.ys*,s*player.position.xs*>=s*platform.position.xs*-s*player.widths*/s*2,?s*]s*;?/);

The instructions are really confusing and could be rephrased. ! I don't think what is referred to as a conditional is a what people are going to think of as a conditional. It is just a Boolean expression that is being asked for. No action or assignment is being given depending on truthiness of the expression. It seems like it is looking for an if, switch, ternary or bare conditional, and I believe only ternary or a bare conditional can be placed inside of an array (Not being nested inside of IIFE) which is knowledge a novice probably won't have. The difference, although small, is that a condition takes an action based on the result of a Boolean expression. No conditional action is being taken, so it is just an expression. Might ask for the first element in the array to be a Boolean expression of the sum of the player's position, height and velocity greater than or equal to the platform's position. There are various steps that follow that refer to Boolean expressions as conditionals. The concern is people learning incorrect terminology and getting mixed up in the field.
Yes, you are correct we should update the terminology for steps 78-81 to say boolean expression instead of conditional statement. I have opened this up for contribution.
For each of the steps, make sure to make the change mentioned above in all of the descriptions. Also, go through and check all of the hint text to make sure the correct terminology is used as well
It is bigger than a few steps. I did not track all the steps but kept seeing it through to the end of the course. It happens everywhere that we later do conditional action based on the Booleans stored in arrays. For each array we made, (I think there were 3? player, platform and checkpoints), the instructions use the same wording.
Looks like we have a PR to address the few steps I mentioned earlier. We can review that and merge it in which will close this particular issue. But then I can audit the project to find the other steps and create a second PR to remove the rest
Did a search and replace for the english files and found five more files total where the change needed to be applied. Here is the PR to resolve that.


Question: { type: 'info', message: dedent` <del> ${username} has chosen to make their profile private. They will need to make their profile public </del> <ins> ${username} has chosen to make their portfolio private. They will need to make their portfolio public </ins> in order for others to be able to view their certification. ` }

<img width="1074" alt="Profile_freeCodeCamp_org" src="https://user-"
can I take this issue?
Thank you and for your interest. This issue might need a little more investigation before arriving at the final solution. I encourage you to find similar issues to tackle in the meantime. should I only audit the copy to replace profile with portfolio or you would rather changing the profile instances in the client and the api-server entirely?
I would like to get it assigned..
this should come as a cosmetic change to the copy only, do not change any endpoints or code (functions, objects, files) etc. It can be done to both API and the client where copy edit is needed.


Question: { type: 'info', message: dedent` <del> ${username} has chosen to make their profile private. They will need to make their profile public </del> <ins> ${username} has chosen to make their portfolio private. They will need to make their portfolio public </ins> in order for others to be able to view their certification. ` }

<img width="927" alt="Settings_freeCodeCamp_org" src="https://user-"


Question: .tool-panel-group-mobile .btn-block + .btn-block { margin: 0 2px 0 0; <ins> padding-left: 8px; padding-right: 8px; </ins> }

This wasn't always the case, but right now the formatting for smaller screens isn't great: ! Smaller screens used to have tabs letting you switch between the instructions, editor and so on. You can see them briefly (in the gif) at medium screen sizes, but not for mobile. If we still want to support this, I can look into restoring it.
Looks like they're just hidden behind the search bar.
Thanks for reporting this, we are still figuring out the final state for the nav. Once that is settled, this issue will be resolved automatically.
This wasn't entirely resolved by , as the challenge tabs are still displaying incorrectly: !


Question: } return bookListCopy; } <del> const newBookList = add(bookList, 'A Brief History of Time'); const newerBookList = remove(bookList, 'On The Electrodynamics of Moving Bodies'); const newestBookList = remove(add(bookList, 'A Brief History of Time'), 'On The Electrodynamics of Moving Bodies'); </del> ```

<!-- NOTE: If you're reporting a security issue, don't create a GitHub issue. Instead, email We will look into it immediately. -- This is the starter code: The starter code for this challenge is strange. 1) Why the space between the function name and the ()s for the arguments? 2) I get that the idea is to have the learners change the function signature, but it is a bit strange having a mismatch between the function signatures and the function calls in the starter code.
The linked PR in this issue. For , we could probably move away from having variables in the seed code and instead assert the function returns the expected value


Question:
"Nest one div element with the class well within each of your col-xs-6 div elements." ], "tests": [  "assert($("div").length > 4, 'Add two div elements inside your div class="well"> element both with the class col-xs-6')",   "assert($("div").length > 4, 'Add a div element with the class well inside each of your div class="col-xs-6"> elements')",  "assert($("div.col-xs-6").children("div.well").length > 1, 'Nest both of your div class="col-xs-6" elements within your div class="row" element.')", "assert(editor.match(/
/g) && editor.match(/<div/g) && editor.match(/
/g).length === editor.match(/<div/g).length, 'Make sure all your div elements have closing tags.')" ],

Challenge has an issue. This is backwards and should read: "Add two div elements inside your "col-xs-6" elements both with the class "well" - or something similar. !