Added :target to Page Inspector pseudo-class toggles

[SebastianZ]

Updated pseudo-class toggle options of Page Inspector to include the :target pseudo-class. And also added it to the release notes for Firefox 87. See bug 1689899.

This change is all mine, from filing the bug over creating the patch plus test to documenting it. 😄 And it will be my first (and surely not last) contribution since the contents moved to GitHub. 🥳

Sebastian

[hamishwillee]

@SebastianZ Fantastic! I'm working on Friday and will look at this then (assuming it is not reviewed by someone else first). FYI this is erroring because the images you added could be more compressed - see https://github.com/mdn/content/pull/2020/checks?check_run_id=1817070267#step:9:19

As it says, you need to run yarn filecheck "files/en-us/tools/page_inspector/how_to/examine_and_edit_css/show_pseudo_classes_hover.png" --save-compression for each of the files/.

This does not currently work (for me) on windows, but it does on Ubuntu.

[chrisdavidmills]

Hah, lovely to see you here @SebastianZ !

I am going to leave you in @hamishwillee 's capable hands for this one, but please shout if you folks need any assistance (e.g. I'm on macOS, so could apply the image compression to the build if needed).

[SebastianZ]

I am also on Windows and I didn't figure out yet how to get Yarn to run there. I'll see if I can get it to work somehow.

It would be great if there were more information about this than

Note, this is how you do it on terminals with bash (macOS and Linux). You have to do it differently on Windows.

Just as a side note. 😄

Sebastian

[SebastianZ]

Ok, got Yarn running by installing it via npm. As @hamishwillee already pointed out, the compression doesn't work though. I get an error that the command cannot be processed syntatically and it results in an exit code 255. 😞 I'll see what I can do.

Sebastian

[hamishwillee]

@SebastianSimon Hot of the press, there is a workaround for compression on windows. On the file in the content root named package.json change the line:

"filecheck": "env-cmd --silent cross-env CONTENT_ROOT=files node node_modules/@mdn/yari/filecheck/cli.js --cwd=$(pwd)",

TO

"filecheck": "env-cmd --silent cross-env CONTENT_ROOT=files node node_modules/@mdn/yari/filecheck/cli.js --cwd=.",

(ie --cwd=.)

I'm back on this tomorrow.

[SebastianZ]

That was it! Thank you very much, @hamishwillee! Especially for helping while not at work!

Sebastian

PS: You mentioned the wrong Sebastian in your comment. 😄

[SebastianSimon]

PS: You mentioned the wrong Sebastian in your comment. 😄

Ah, that’s why I’m randomly receiving emails; I was so confused. 😄

[hamishwillee]

Many apologies - who would have thought there could be two Sebastians in the world :-).

[hamishwillee]

Looks great @SebastianZ .

Please see inline comments. Could you also update the screenshot for the image after the one you updated - https://github.com/mdn/content/pull/2020/files#diff-23e77088e1e57c2827717e5b4491d2cdfca0614474fdfec364ea9012edf29c7cR162 - as this also shows the selector toggles.

[SebastianZ]

Looks great @SebastianZ .

Please see inline comments. Could you also update the screenshot for the image after the one you updated - https://github.com/mdn/content/pull/2020/files#diff-23e77088e1e57c2827717e5b4491d2cdfca0614474fdfec364ea9012edf29c7cR162 - as this also shows the selector toggles.

Oh, right! How could I miss that? I've replaced that image now, too.

Sebastian

[hamishwillee]

Great!

@chrisdavidmills This is good, but should not be merged until FF86 is in, and users can reasonably expect to start seeing docs for FF87. I have marked as "WIP - do not merge" in the title. Can you create an FF87 project and add this so we don't miss it?

[chrisdavidmills]

I'd be OK to merge this, as version 87 is available as Firefox Nightly, provided we say it is aailable in 87 onwards...

One thing though — I can't see it in my Nightly. Is it behind a flag or something? I just updated.

[Ryuno-Ki]

I have marked as "WIP - do not merge" in the title.

Would it be possible to also mark it as a Draft PR? That would effectively block the merge in GitHub.

[hamishwillee]

@chrisdavidmills

version 87 is available as Firefox Nightly, provided we say it is aailable in 87 onwards...

We discussed that the text to add "from v87 onwards" looks pretty ugly here, and we'd need to add a second PR in a month when FF87 comes out to remove it. So we figured we'd rather just wait/not merge.

@Ryuno-Ki I don't have any rights to revert things to draft, which is why I marked heading as WIP. If you do then please make the change.

[Ryuno-Ki]

It's a draft now. Let us know once you feel it's complete enough to get merged.
Current subscriptions by people who commented are still in place.

[chrisdavidmills]

We discussed that the text to add "from v87 onwards" looks pretty ugly here, and we'd need to add a second PR in a month when FF87 comes out to remove it. So we figured we'd rather just wait/not merge.

Ah OK, makes sense. Thanks for the clarification.

[hamishwillee]

@chrisdavidmills This is now ready to go in as fix for #2508

[chrisdavidmills]

I already looked at this...let's get it merged ;-)

[SebastianZ]

I guess I can mark the related bug as dev-doc-complete now, right?

Sebastian

[chrisdavidmills]

I guess I can mark the related bug as dev-doc-complete now, right?

Sebastian

yup! And provide a reference to this issue, so the engineers can see what work happened.