Description: Please provide an explanation of the feature or change. Include a description of the user scenario in which it would be used and how the user would complete the task(s). *We are replacing our "Report Site Issue" interface to a simplified reporting tool directly in Firefox Release. If a user encounters a broken site, they will be able to access this reporting tool via three entry points: the Help menu, the hamburger menu, and the ETP Shield Icon menu. Once the reporting tool is triggered, the user will see 3 elements:* *1. A populated (yet editable) URL text field* *2. A dropdown menu of pre-set webcompat categories detailing what's broken, such as "Site slow or not working" or "Images or videos"* *3. An optional comment text field where the user can describe the problem in further detail* *Once the user submits the report, the reporting tool UI will close and trigger a pop-up confirming that the report was sent.* How do we test this? If there is an implementation to test, please provide instructions for testing it; e.g. setting preferences, other preparation, how to trigger the UI, etc. *Tom can share the latest Treeherder build. One thing to note: testers will need to flip a pref in about:config to enable the dropdown menu in the reporting UI. When you get to about:config, search for "ui.new-webcompat-reporter.reason-dropdown" and switch the pref from 0 to either 1 or 2.* *Pref options:* *0: Disable dropdown* *1: Enable optional* *2: Enable non-optional* When will this ship? *Firefox 120-121* Tracking bug/issue: https://bugzilla.mozilla.org/show_bug.cgi?id=1852340 Design documents (e.g. Product Requirements Document, UI spec): **Figma** https://www.figma.com/file/tRpI5FnvDmWMSUXJNutqkI/Webcompat-Reporting-Tool?type=design&node-id=15-3479&mode=design&t=WYoBMXfJUxWm6VXI-0 **ENG Spec** https://docs.google.com/document/d/1YvGfNBdJ7uCwnAaa5zikQpLhAgtn60MVP78VYUj_q-g/edit#heading=h.ms9n7142uusj Engineering lead: *Tom Wisniewski* Product manager: *Karen Kim* The accessibility team has developed the Mozilla Accessibility Release Guidelines which outline what is needed to make user interfaces accessible: https://wiki.mozilla.org/Accessibility/Guidelines Please describe the accessibility guidelines you considered and what steps you've taken to address them: *During the Design process, we have engaged with the a11y team for an official design review of our Figma. Prior to the handoff to Engineering, our UX Designer incorporated any a11y feedback into the latest wireframes. We should be in compliance with text and color contrast.* Describe any areas of concern to which you want the accessibility team to give special attention: *1. Could you please give special attention to any code issues with screenreader capability? We want to ensure that the reporting tool (with and without the dropdown menu) is readable across OS--i.e., VoiceOver, NVDA, and Orca.* *2. We expect that the Webcompat Reporting Tool will operate similarly to the current ETP "Site not working?" > "Send a report" user flow. With this in mind, we would like to confirm with a11y that issues such as form controls and focus are working properly, especially for keyboard-only users.*
Bug 1852340 Comment 1 Edit History
Note: The actual edited comment in the bug view page will always show the original commenter’s name and original timestamp.
Description: Please provide an explanation of the feature or change. Include a description of the user scenario in which it would be used and how the user would complete the task(s). *We are replacing our "Report Site Issue" interface to a simplified reporting tool directly in Firefox Release. If a user encounters a broken site, they will be able to access this reporting tool via three entry points: the Help menu, the hamburger menu, and the ETP Shield Icon menu. Once the reporting tool is triggered, the user will see 3 elements:* *1. A populated (yet editable) URL text field* *2. A dropdown menu of pre-set webcompat categories detailing what's broken, such as "Site slow or not working" or "Images or videos"* *3. An optional comment text field where the user can describe the problem in further detail* *Once the user submits the report, the reporting tool UI will close and trigger a pop-up confirming that the report was sent.* How do we test this? If there is an implementation to test, please provide instructions for testing it; e.g. setting preferences, other preparation, how to trigger the UI, etc. *Tom can share the latest Treeherder build. One thing to note: testers will need to flip a pref in about:config to enable the dropdown menu in the reporting UI. When you get to about:config, search for "ui.new-webcompat-reporter.reason-dropdown" and switch the pref from 0 to either 1 or 2.* *Pref options:* *0: Disable dropdown* *1: Enable optional* *2: Enable non-optional* When will this ship? *Firefox 121-122* Tracking bug/issue: https://bugzilla.mozilla.org/show_bug.cgi?id=1852340 Design documents (e.g. Product Requirements Document, UI spec): **Figma** https://www.figma.com/file/tRpI5FnvDmWMSUXJNutqkI/Webcompat-Reporting-Tool?type=design&node-id=15-3479&mode=design&t=WYoBMXfJUxWm6VXI-0 **ENG Spec** https://docs.google.com/document/d/1YvGfNBdJ7uCwnAaa5zikQpLhAgtn60MVP78VYUj_q-g/edit#heading=h.ms9n7142uusj Engineering lead: *Tom Wisniewski* Product manager: *Karen Kim* The accessibility team has developed the Mozilla Accessibility Release Guidelines which outline what is needed to make user interfaces accessible: https://wiki.mozilla.org/Accessibility/Guidelines Please describe the accessibility guidelines you considered and what steps you've taken to address them: *During the Design process, we have engaged with the a11y team for an official design review of our Figma. Prior to the handoff to Engineering, our UX Designer incorporated any a11y feedback into the latest wireframes. We should be in compliance with text and color contrast.* Describe any areas of concern to which you want the accessibility team to give special attention: *1. Could you please give special attention to any code issues with screenreader capability? We want to ensure that the reporting tool (with and without the dropdown menu) is readable across OS--i.e., VoiceOver, NVDA, and Orca.* *2. We expect that the Webcompat Reporting Tool will operate similarly to the current ETP "Site not working?" > "Send a report" user flow. With this in mind, we would like to confirm with a11y that issues such as form controls and focus are working properly, especially for keyboard-only users.*