Freecodecamp: Wrong CSS selector type passes challenge

[lasjorg]

The challenge is asking to use an element selector but the regex allows for a class selector.

Challenge: https://www.freecodecamp.org/learn/responsive-web-design/basic-css/import-a-google-font

Forum post: https://www.freecodecamp.org/forum/t/html-css-font-help/395209

[scissorsneedfoodtoo]

Thanks for reporting this @lasjorg. I agree that this can be confusing even if the text makes it clear to use an element selector.

To anyone who works on this, it seems like changing the third testString to the following will fix this:

assert(/^\s*h2\s*\{\s*font-family\:\s*(\"|")?Lobster(\"|")?(.{0,})\s*;\s*\}/gim.test(code));

That change should still allow all valid rules targeting h2, but not match .h2.

[1t1e1]

Hi. I understand the bug. I want to do this. Can I take it.

[ieahleen]

@1t1e1 : as per contribution guidelines all the issues with Help wanted label are up for grabs and you do not need to seek permission before start working on them

[g4rry420]

hello, I am working on the issue, just one question , the last line of testString should include gim.test(code)); OR gi.test(code));

[Sky020]

@g4rry420 , probably best using:

assert(code.match(regex))

[1t1e1]

@g4rry420 I think it must be gim. I guess it part of regex and m stand for multi line. It will solve to pass code with rule that does not ask like font-size:30px.

@Ieahleen Thank you. I missed. Actually I found this document too late. newbie problems. :relieved:

[g4rry420]

38944 @lasjorg Can you please review the changes I have made to the files. Thank You

[ptkpyitheim]

@scissorsneedfoodtoo

Your regex works for

h2 {
font-family: "Lobster";
}

h2 {
font-family: Lobster;
}

but doesn't work for single quoted Lobster as such : 'Lobster'

I changed the regex to be this and it works for all three test cases.

assert(/\s*h2\s*\{\s*font-family\:\s*(\"|"|\')?Lobster(\"|"|\')?(.{0,})\s*;\s*\}/gi.test(code));

Making pull request soon.

[scissorsneedfoodtoo]

Awesome, thanks for catching that @ptkpyitheim and for submitting a PR so quickly.

[programmerraja]

is still open ? i like to contribute can i?

[Sky020]

@programmerraja , Sorry, this issue has a linked pull-request that is likely to close the issue. You are welcome to work on other issues with the _help wanted_ label which do not have open PRs.

[RandellDawson]

@Sky020 @scissorsneedfoodtoo See my comment on the original issue. If we expect the user to use a type selector, then why don't we ask the user to use a type selector. Other, the user should be allowed to create an .h2 selector and specify h2 in the class attribute. Then, the testString changes in #39084 make sense. If you all agree, I can make the additional commit and we can get this PR approved/merged. Let me know your thoughts.

EDIT: I just realize we never explain what a type selector is, so this opens a can of worms.

[Sky020]

@RandellDawson . In that case, shall we edit the test to be inclusive of all selector types?

We could edit the instructions to be more specific, but I am concerned there will be too much jargon which will confuse more.

[lasjorg]

I don't see why we should complicate this any more than we have to. The previous challenge shows how to set the font family on an element using the element selector. This challenge was in my opinion clearly made with the intention of the camper using an element selector to set the font, even if it is not explicitly said so.

I suggest we limit the valid selector to just the element selector. If we can get @ptkpyitheim to update the challenge instructions with the proposed change to the text that @RandellDawson gave in the PR I'd be in favor of this.

[prakharindoria]

I would like to contribute.

[RandellDawson]

@prakharindoria There currently is an outstanding PR #39084 that we are waiting on the contributor to update based on the latest discussion in this issue. If the user does not make the changes in the next week, then you could go ahead and create a PR.

There are many other issues listed where you could help. See if you can find one that does not currently have a PR for it.

[prakharindoria]

Its great to hear from you @RandellDawson. I will look into something else.

[ptkpyitheim]

Awesome, thanks for catching that @ptkpyitheim and for submitting a PR so quickly.

Yes, no problem. I'm checking out the comments on the PR link.