Here is a quick gif / click prototype that represents the design approach proposed in this thread. I've used the tooltip, dialog, and message components from Codex. Note that the toast component would be my first choice over the message component to communicate "success" but it's not quite ready for use yet.

I have a bit of time next week to explore a couple other possible solutions but wanted to make sure we had this documented.

That design seems feasible. Just a note that in addition to the "report visual bug" UX we're also looking for a replacement design for the "parsoid icon" indicator to indicate that parsoid is in use on the page -- the replacement could be "no replacement", a message in the footer, a revised indicator, etc -- we should just document what the proposed replacement is.

@cscott Thanks for the reminder about the indicator!

After catching up with @RHo about this our advice remains pretty similar. Since the rollout will take quite a few months (Let me know if I'm misremembering that!), most folks, unless they're super technical, probably won't understand Parsoid or connect any bugs to its implementation and could cause more confusion than clarity. So we recommend keeping the indicator / icon out of that super prominent real estate at the top or toolbar and instead placing it in the footer during the rollout with a link to the project page for more info.

Even more important than the icon or logo which I didn't include in this mockup, is a link to the MediaWiki page or project page where folks can learn more. In general I think the most important user education for this work where we let folks know where and how to report a bug and how to tell if a page is rendered in Parsoid will be on that MW page, project page, etc.

@mwilliams anything learned from the "bit of time next week to explore a couple other possible solutions", or is this design ready to implement?

In T363484#10887904, @cscott wrote:

@mwilliams anything learned from the "bit of time next week to explore a couple other possible solutions", or is this design ready to implement?

Hi @cscott - since @mwilliams will be signing off tomorrow, I can be the point for this task. Confirming Matthew's post on T363484#10849212 that the recommendation is to place the notice in the footer, completely out of the top navigation and main part of the page above the 'fold' where it will overly prominent and likely confusing for 99.9% of readers:

In T363484#10849212, @mwilliams wrote:

@cscott Thanks for the reminder about the indicator!
After catching up with @RHo about this our advice remains pretty similar. Since the rollout will take quite a few months (Let me know if I'm misremembering that!), most folks, unless they're super technical, probably won't understand Parsoid or connect any bugs to its implementation and could cause more confusion than clarity. So we recommend keeping the indicator / icon out of that super prominent real estate at the top or toolbar and instead placing it in the footer during the rollout with a link to the project page for more info.

Even more important than the icon or logo which I didn't include in this mockup, is a link to the MediaWiki page or project page where folks can learn more. In general I think the most important user education for this work where we let folks know where and how to report a bug and how to tell if a page is rendered in Parsoid will be on that MW page, project page, etc.

Change #1159598 had a related patch set uploaded (by C. Scott Ananian; author: C. Scott Ananian):

[mediawiki/core@master] Move Parsoid indicator from top of page to footer

https://gerrit.wikimedia.org/r/1159598

Change #1160203 had a related patch set uploaded (by C. Scott Ananian; author: C. Scott Ananian):

[mediawiki/extensions/ParserMigration@master] Add configuration to disable notice and/or indicator

https://gerrit.wikimedia.org/r/1160203

Test wiki created on Patch demo by RHo (WMF) using patch(es) linked to this task:
https://patchdemo.wmcloud.org/wikis/fa90afdded/w/

Test wiki created on Patch demo by RHo (WMF) using patch(es) linked to this task:
https://patchdemo.wmcloud.org/wikis/d27024bde8/wiki/Douglas Adams

hi @cscott - I can't seem to get the footer notice showing in patchdemo, nor on beta or testwiki. Apologies but are there specific settings I should have made to test on Patchdemo, and/or an article that i should be testing on?

Beta	Patchdemo	testwiki

Also, it may be good to ping @Jdrewniak for help with review since @Jdlrobson is ooo till Aug.

Sorry, you'll need the parser migration extension installed, and to have parsoid read views enabled for your account:
https://www.mediawiki.org/wiki/Help:Extension%3AParserMigration
That is installed on beta and testwiki, I believe, so it should just be a matter of enabling parsoid read views in your user preferences.

For patch demo, there's https://gerrit.wikimedia.org/r/c/mediawiki/extensions/ParserMigration/+/1100121 which I think can help, but I haven't tried this myself.

Change #1160859 had a related patch set uploaded (by C. Scott Ananian; author: C. Scott Ananian):

[mediawiki/extensions/ParserMigration@master] Initial support for "report visual bug" link in sidebar

https://gerrit.wikimedia.org/r/1160859

Change #1161118 had a related patch set uploaded (by C. Scott Ananian; author: C. Scott Ananian):

[mediawiki/extensions/ParserMigration@master] Create "report visual bug" dialog, without submission logic

https://gerrit.wikimedia.org/r/1161118

Test wiki created on Patch demo by RHo (WMF) using patch(es) linked to this task:
https://patchdemo.wmcloud.org/wikis/5b83232f31/wiki/New York City

In T363484#10932402, @cscott wrote:

Sorry, you'll need the parser migration extension installed, and to have parsoid read views enabled for your account:
https://www.mediawiki.org/wiki/Help:Extension%3AParserMigration
That is installed on beta and testwiki, I believe, so it should just be a matter of enabling parsoid read views in your user preferences.

For patch demo, there's https://gerrit.wikimedia.org/r/c/mediawiki/extensions/ParserMigration/+/1100121 which I think can help, but I haven't tried this myself.

Thanks, that worked for the new patchdemo and looks good to me there!

however, fwiw it looks like test and beta it's still showing up as the icon after I turn on read views in prefs.

Test wiki created on Patch demo by RHo (WMF) using patch(es) linked to this task:
https://patchdemo.wmcloud.org/wikis/07f2433cb3/wiki/Douglas Adams

Test wiki on Patch demo by RHo (WMF) using patch(es) linked to this task was deleted:

https://patchdemo.wmcloud.org/wikis/07f2433cb3/w/

Test wiki created on Patch demo by RHo (WMF) using patch(es) linked to this task:
https://patchdemo.wmcloud.org/wikis/5ab5d73ccc/wiki/New York (magazine)

In T363484#10937870, @PatchDemoBot wrote:

Test wiki created on Patch demo by RHo (WMF) using patch(es) linked to this task:
https://patchdemo.wmcloud.org/wikis/5ab5d73ccc/wiki/New York (magazine)

Hi @cscott can't seem to get the report visual bug link to show up - the old parsoid migration notice popover appears is still showing:

Change #1160203 merged by jenkins-bot:

[mediawiki/extensions/ParserMigration@master] Add configuration to disable notice and/or indicator

https://gerrit.wikimedia.org/r/1160203

Change #1159598 merged by jenkins-bot:

[mediawiki/core@master] Move Parsoid indicator from top of page to footer

https://gerrit.wikimedia.org/r/1159598

In his review, @Arlolra pointed out that the footer text is not used in the MinervaNeue skin. (I tested every other skin available on patchdemo and they looked fine).

MinervaNeue looks like:

Any thoughts on where the 'rendered with Parsoid' text should go for this skin? I'm thinking in the footer, as another item in the "Privacy policy Mobile view Developers Statistics Cookie statement" list.

Change #1160859 had a related patch set uploaded (by C. Scott Ananian; author: C. Scott Ananian):

[mediawiki/extensions/ParserMigration@master] Initial support for "report visual bug" link in sidebar

https://gerrit.wikimedia.org/r/1160859

Change #1161118 had a related patch set uploaded (by C. Scott Ananian; author: C. Scott Ananian):

[mediawiki/extensions/ParserMigration@master] Create "report visual bug" dialog, without submission logic

https://gerrit.wikimedia.org/r/1161118

Change #1164516 had a related patch set uploaded (by C. Scott Ananian; author: C. Scott Ananian):

[mediawiki/extensions/ParserMigration@master] DNM: turn on 'report visual bug' for patchdemo

https://gerrit.wikimedia.org/r/1164516

Patch demo at https://patchdemo.wmcloud.org/wikis/e5a16a7d5c/wiki/New_York_(magazine) -- no back end yet, but this is a good place to check the UX layout of the dialog.

In T363484#10955544, @cscott wrote:

In his review, @Arlolra pointed out that the footer text is not used in the MinervaNeue skin. (I tested every other skin available on patchdemo and they looked fine).

MinervaNeue looks like:

Any thoughts on where the 'rendered with Parsoid' text should go for this skin? I'm thinking in the footer, as another item in the "Privacy policy Mobile view Developers Statistics Cookie statement" list.

thanks @Arlolra that is a good catch! given this is meant to be temporary and unobtrustive, I agree @cscott it should be in he footer area but would suggest putting it as a second sentence after the Content licence instead. And given it needs to appear in different places, I like the suggestion by @Arlolra for copyedit from altering the existing footer sentence and instead having one string that is a self-contained single sentence we can add and remove across all skins: "Page was rendered in Parsoid."
Quick mock:

Desktop	Mobile

Change #1165094 had a related patch set uploaded (by C. Scott Ananian; author: C. Scott Ananian):

[operations/mediawiki-config@master] Disable ParserMigration indicator and user notice

https://gerrit.wikimedia.org/r/1165094

Change #1165120 had a related patch set uploaded (by C. Scott Ananian; author: C. Scott Ananian):

[mediawiki/core@master] skin: Separate localization of "rendered with" phrase from "last modified"

https://gerrit.wikimedia.org/r/1165120

Change #1165121 had a related patch set uploaded (by C. Scott Ananian; author: C. Scott Ananian):

[mediawiki/core@master] Make "rendered with" a separate skin footer component

https://gerrit.wikimedia.org/r/1165121

Change #1165123 had a related patch set uploaded (by C. Scott Ananian; author: C. Scott Ananian):

[mediawiki/skins/Vector@master] Put .footer-info-renderedWith next to .footer-info.lastmod

https://gerrit.wikimedia.org/r/1165123

Test wiki created on Patch demo by Cscott using patch(es) linked to this task:
https://patchdemo.wmcloud.org/wikis/635dce98c6/w/

Change #1165145 had a related patch set uploaded (by C. Scott Ananian; author: C. Scott Ananian):

[mediawiki/skins/Timeless@master] skin footer: Put 'rendered with' next to 'lastmod'

https://gerrit.wikimedia.org/r/1165145

Test wiki created on Patch demo by Cscott using patch(es) linked to this task:
https://patchdemo.wmcloud.org/wikis/da51ae6990/w/

Test wiki on Patch demo by Cscott using patch(es) linked to this task was deleted:

https://patchdemo.wmcloud.org/wikis/635dce98c6/w/

Test wiki created on Patch demo by Cscott using patch(es) linked to this task:
https://patchdemo.wmcloud.org/wikis/d6bfc596bf/wiki/New York City

Updated the patchdemo with the render information as a separate sentence: https://patchdemo.wmcloud.org/wikis/d6bfc596bf/wiki/New_York_City

Test wiki on Patch demo by Cscott using patch(es) linked to this task was deleted:

https://patchdemo.wmcloud.org/wikis/da51ae6990/w/

Change #1165120 merged by jenkins-bot:

[mediawiki/core@master] skin: Separate localization of "rendered with" phrase from "last modified"

https://gerrit.wikimedia.org/r/1165120

Change #1165170 had a related patch set uploaded (by C. Scott Ananian; author: C. Scott Ananian):

[mediawiki/extensions/ParserMigration@master] WIP: Create "report visual bug" dialog based on mw.feedback

https://gerrit.wikimedia.org/r/1165170

Test wiki created on Patch demo by Cscott using patch(es) linked to this task:
https://patchdemo.wmcloud.org/wikis/4c46f8931d/wiki/New York City

Test wiki on Patch demo by Cscott using patch(es) linked to this task was deleted:

https://patchdemo.wmcloud.org/wikis/d6bfc596bf/w/

Adding @Sarai-WMF in case there's design review needed while i'm ooo until Jul 14 :)

Change #1165566 had a related patch set uploaded (by C. Scott Ananian; author: C. Scott Ananian):

[mediawiki/extensions/ParserMigration@master] WIP: "Report Visual Bug" submission logic

https://gerrit.wikimedia.org/r/1165566

Test wiki created on Patch demo by Cscott using patch(es) linked to this task:
https://patchdemo.wmcloud.org/wikis/91b4445580/wiki/New York City

Test wiki on Patch demo by Cscott using patch(es) linked to this task was deleted:

https://patchdemo.wmcloud.org/wikis/4c46f8931d/w/

Change #1165123 merged by jenkins-bot:

[mediawiki/skins/Vector@master] Put #footer-info-renderedwith inline next to #footer-info-lastmod

https://gerrit.wikimedia.org/r/1165123

Change #1165145 merged by jenkins-bot:

[mediawiki/skins/Timeless@master] skin footer: Put 'rendered with' next to 'lastmod'

https://gerrit.wikimedia.org/r/1165145

Change #1165121 merged by jenkins-bot:

[mediawiki/core@master] Make "rendered with" a separate skin footer component

https://gerrit.wikimedia.org/r/1165121

Change #1160859 merged by jenkins-bot:

[mediawiki/extensions/ParserMigration@master] Initial support for "report visual bug" link in sidebar

https://gerrit.wikimedia.org/r/1160859

Test wiki on Patch demo by Cscott using patch(es) linked to this task was deleted:

https://patchdemo.wmcloud.org/wikis/91b4445580/w/

Change #1161118 abandoned by C. Scott Ananian:

[mediawiki/extensions/ParserMigration@master] Create "report visual bug" dialog, without submission logic

Reason:

Squashed into If7669acca51430392e57b77b6886f9b3921c70cf

https://gerrit.wikimedia.org/r/1161118

Current patch demo is at https://649538b6c5.catalyst.wmcloud.org/wiki/New%20York%20City and is ready for review. I had to make a few tweaks to the design to accomodate the selected backend (posting to a talk page). In particular, I needed to provide a topic for the post and also to inform the user of the page where the message would be/was posted.

In T363484#11015070, @cscott wrote:

Current patch demo is at https://649538b6c5.catalyst.wmcloud.org/wiki/New%20York%20City and is ready for review. I had to make a few tweaks to the design to accomodate the selected backend (posting to a talk page). In particular, I needed to provide a topic for the post and also to inform the user of the page where the message would be/was posted.

Thanks @cscott - I wonder if we can use this task for feedback on the migration notice work – removing the popover notice and replacing with the footer message first? I think the footer message looks good on mobile and desktop, so the remaining item is to remove the popup.

Review of https://649538b6c5.catalyst.wmcloud.org/wiki/New%20York%20City :

Review description	Screenshot
Desktop footer V2022
Desktop footer Vector legacy
Mobile footer (Minerva)
Popup - still needs to be removed:

I pasted expected mocks for the reporting visual bug on description on the separate task earlier T365371: ParserMigration: Add "report visual bug" link so will post design review there shortly.

Change #1170511 had a related patch set uploaded (by C. Scott Ananian; author: C. Scott Ananian):

[mediawiki/extensions/ParserMigration@master] Turn off old indicator and user notice; turn on Report Visual Bug.

https://gerrit.wikimedia.org/r/1170511

Change #1170511 merged by jenkins-bot:

[mediawiki/extensions/ParserMigration@master] Turn off old indicator and user notice

https://gerrit.wikimedia.org/r/1170511

Change #1165170 abandoned by C. Scott Ananian:

[mediawiki/extensions/ParserMigration@master] WIP: Create "report visual bug" dialog based on mw.feedback

Reason:

Abandoned in favor of If7669acca51430392e57b77b6886f9b3921c70cf

https://gerrit.wikimedia.org/r/1165170

Change #1165094 merged by jenkins-bot:

[operations/mediawiki-config@master] Disable ParserMigration indicator and user notice

https://gerrit.wikimedia.org/r/1165094

Mentioned in SAL (#wikimedia-operations) [2025-07-23T20:34:35Z] <cscott@deploy1003> Started scap sync-world: Backport for [[gerrit:1172108|Create "report visual bug" dialog (T365371)]], [[gerrit:1165094|Disable ParserMigration indicator and user notice (T363484 T363472)]]

Mentioned in SAL (#wikimedia-operations) [2025-07-23T20:58:49Z] <cscott@deploy1003> cscott: Backport for [[gerrit:1172108|Create "report visual bug" dialog (T365371)]], [[gerrit:1165094|Disable ParserMigration indicator and user notice (T363484 T363472)]] synced to the testservers (see https://wikitech.wikimedia.org/wiki/Mwdebug). Changes can now be verified there.

Mentioned in SAL (#wikimedia-operations) [2025-07-23T21:15:32Z] <cscott@deploy1003> Finished scap sync-world: Backport for [[gerrit:1172108|Create "report visual bug" dialog (T365371)]], [[gerrit:1165094|Disable ParserMigration indicator and user notice (T363484 T363472)]] (duration: 40m 57s)

Just tested on wikivoyage and visual notice on footer LGTM:

Review description	Screenshot
Desktop footer V2022
Mobile footer (Minerva)
Old popup - no longer appearing

A couple minor items on the report bug flow that I'll post on T365371: ParserMigration: Add "report visual bug" link but good to call this task design review complete!

Change #1164516 abandoned by C. Scott Ananian:

[mediawiki/extensions/ParserMigration@master] DNM: turn on 'report visual bug' for patchdemo

Reason:

no longer needed

https://gerrit.wikimedia.org/r/1164516

Test wiki on Patch demo by RHo (WMF) using patch(es) linked to this task was deleted:

https://patchdemo.wmcloud.org//wikis/d27024bde8/w/

Test wiki on Patch demo by RHo (WMF) using patch(es) linked to this task was deleted:

https://patchdemo.wmcloud.org//wikis/fa90afdded/w/

Test wiki on Patch demo by RHo (WMF) using patch(es) linked to this task was deleted:

https://patchdemo.wmcloud.org//wikis/d27024bde8/w/

Test wiki on Patch demo by RHo (WMF) using patch(es) linked to this task was deleted:

https://patchdemo.wmcloud.org//wikis/fa90afdded/w/