Change ToggleSwitch ViewComponent type to button

[acbreton]

Closes: #3939

What are you trying to accomplish?

Ensure Primer::Alpha::ToggleSwitch does not accidentally submit its parent <form> when clicked. The ToggleSwitch track is rendered as a <button> and, without an explicit type, defaults to type="submit" inside forms. This triggers Chrome’s native required-field validation tooltips on unrelated empty required fields. This change sets type="button" on the ToggleSwitch track button.

Screenshots

Before: Clicking ToggleSwitch inside a form shows native validation tooltips on other empty required fields (Chrome).

Screen.Recording.2026-02-12.at.12.27.06.PM.mov

After: Clicking ToggleSwitch no longer triggers native validation tooltips; only the toggle state changes.

Screen.Recording.2026-02-13.at.10.22.29.AM.mov

Integration

No production code updates required beyond consuming the updated component. This is a component-level change.

List the issues that this change affects.

Closes https://github.com/github/authz-exp/issues/1323

Risk Assessment

• Low risk — One-line HTML attribute fix (type="button") on a single internal button. Easy to observe and roll back. Adds test coverage.

What approach did you choose and why?

Set type="button" on the internal .ToggleSwitch-track button unconditionally. ToggleSwitch is an interactive control (and optionally performs its own POST via src), so it should never behave like a form submit button by default. Making this explicit prevents accidental form submission and browser validation UI across all usages inside forms.

Anything you want to highlight for special attention from reviewers?

• Confirm there are no supported/intentional use cases where ToggleSwitch should submit a parent form via native submit semantics. (If needed, we can discuss an explicit API, but the current default behavior is a footgun.)
• Added a test asserting the type="button" attribute is present on the track button.

Accessibility

• No new axe scan violation — Prevents unexpected browser validation UI; no changes to roles/aria beyond button type.

Merge checklist

• Added/updated tests
• Added/updated documentation
• Added/updated previews (Lookbook)
• Tested in Chrome
• Tested in Firefox
• Tested in Safari
• Tested in Edge

[changeset-bot]

🦋 Changeset detected

Latest commit: dad40e8

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

Name	Type
@primer/view-components	Minor

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[Copilot]

Pull request overview

This PR updates Primer::Alpha::ToggleSwitch so its internal track <button> explicitly uses type="button", preventing accidental form submissions (and related browser validation UI) when the component is used inside a <form>.

Changes:

• Add type: :button to the ToggleSwitch track button render.
• Add test coverage asserting the track button’s type is button (and not submit).

Reviewed changes

Copilot reviewed 2 out of 2 changed files in this pull request and generated 2 comments.

File	Description
app/components/primer/alpha/toggle_switch.html.erb	Sets the internal track button to type="button" to avoid default submit behavior in forms.
test/components/alpha/toggle_switch_test.rb	Adds assertions around the track button type attribute.

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.