Bug 1995464 - Overhaul guided bug entry form

[kyoshino]

Bug 1995464 - Overhaul guided bug entry form

Apologies for the long delay. 🙇🏼 🙇🏼 🙇🏼 Here’s a complete overhaul of the guided bug entry form.

• Fresh, responsive design
• Additional product options
• Standard Markdown editor
• Redesigned attachment selector — This also applies to the standard bug entry form and the new attachment page, solving Bug 1982282

These features that require backend changes are missing in this PR. I’ll follow up later.

• User preference to change the default entry form
• Ability to add multiple attachments

[dklawren]

Thanks Kohei! I will look at this in detail tomorrow.

[Copilot]

🟡 Changes recommended

Attachment state, MIME selection, clipboard handling, and capture cleanup contain unresolved correctness and security regressions.

Once you've addressed the issues Copilot identified, you can request another Copilot review.

Pull request overview

Overhauls the guided bug-entry workflow and modernizes attachment selection across bug-creation pages.

Changes:

• Redesigns the responsive guided product, duplicate-search, and bug-detail steps.
• Introduces a reusable attachment selector supporting files, text, clipboard content, and screenshots.
• Updates shared responsive styles, BugModal integration, and Selenium helpers.

File summaries

File	Description
template/en/default/bug/create/create.html.tmpl	Uses the renamed attachment API.
template/en/default/attachment/createformcontents.html.tmpl	Replaces static selector markup with a placeholder.
template/en/default/attachment/create.html.tmpl	Marks new attachments as required.
skins/standard/index.css	Moves message layout styling globally.
skins/standard/global.css	Adds responsive tables and shared control styles.
skins/standard/buglist.css	Removes superseded responsive table rules.
skins/standard/attachment.css	Styles the redesigned attachment selector.
qa/t/4_test_show_all_products.t	Updates guided product-selection automation.
qa/t/3_test_external_attachments.t	Uses the new text-attachment helper.
js/data-table.js	Adds responsive labels and empty-table handling.
js/attachment.js	Implements the reusable attachment selector and form integration.
extensions/GuidedBugEntry/web/style/guided.css	Redesigns the guided workflow layout.
extensions/GuidedBugEntry/web/js/products.js	Updates supported products and metadata.
extensions/GuidedBugEntry/web/js/guided.js	Reimplements the guided wizard behavior.
extensions/GuidedBugEntry/template/en/default/guided/products.html.tmpl	Expands and refreshes product choices.
extensions/GuidedBugEntry/template/en/default/guided/guided.html.tmpl	Rebuilds the guided form markup.
extensions/GuidedBugEntry/template/en/default/bug/create/comment-guided.txt.tmpl	Formats guided comments with section headings.
extensions/GuidedBugEntry/Extension.pm	Removes obsolete web-development parameters.
extensions/BugModal/web/create.js	Integrates the new attachment API.
extensions/BugModal/web/bug_modal.js	Delegates attachment validation.
extensions/BugModal/web/bug_modal.css	Removes duplicated validation styles.
extensions/BugModal/template/en/default/bug_modal/field.html.tmpl	Uses shared error-message styling.
Bugzilla/Test/Selenium.pm	Adds a helper for entering attachment text.

Review details

Suppressed comments (2)

js/attachment.js:529

• resetFields() is also called when the standard bug form’s “Don't add an attachment” action is used, but it leaves the selector in its current visual mode. If the text editor was open, reopening attachments shows only an empty editor and hides all Browse/Paste/Capture actions until the user finds the remove control. Restore the initial action/editor state as part of the reset.

    this.clearPreview();
    this.clearError();
    this.updateText();

js/attachment.js:1093

• This callback runs for pasted text as well as images. For textual patches, AttachmentTextUpdated has already detected and enabled the patch state, but this then unchecks and disables it, so a pasted diff is submitted as an ordinary text attachment. Only apply this override to image clipboard items.

  onAttachmentPasted({ items }) {
    this.updateIsPatch(false, true);

• Files reviewed: 23/31 changed files
• Comments generated: 5
• Review effort level: Balanced

---

💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.

[dklawren]

Everything checks out from manual testing. Review the following claude comments and once resolved or disputed, we will be ready to go with this.

[kyoshino]

Claude said all the comments made sense and solved them 😅

[dklawren]

One last item from the final review pass. Everything else checks out, with all 27 threads verified as actually applied in code, and both disputes holding up.

js/attachment.js:1122: onAttachmentPasted() unconditionally unchecks and disables the patch checkbox.

This was Copilot's suppressed comment #2, so it never became a thread and was never triaged either way.

Repro: paste a diff with the Paste Text or Image button. AttachmentTextUpdated fires first and correctly checks the patch box. AttachmentPasted then fires immediately after and clears it with disabled = true. The attachment is filed as plain text/plain with description "patch", and the checkbox is disabled so it cannot be corrected without Remove plus retype. Dragging the same text in works fine (no AttachmentPasted), and the guided form is unaffected since it does not wire that handler.

The override only makes sense for image clipboard items, where the content genuinely cannot be inspected:

  onAttachmentPasted({ items }) {
    if (items.some((item) => item.types.includes('image/png'))) {
      this.updateIsPatch(false, true);
    }
  }

Happy to take this as a follow-up bug instead if you would rather not respin.

[kyoshino]

Done. Claude confirmed it was a regression from the rewrite.