feat(compat-table): add browser visibility settings - #1880
Merged
Merged
Conversation
Contributor
|
c729dc4 was deployed to: https://fred-pr1880.review.mdn.allizom.net/ |
Contributor
|
As an end-user I'm likely to click outside of the modal after configuring the browsers without clicking "OK". Right now that undoes my choices. It may be more user-friendly to open a confirmation prompt asking if you wish to save or discard your changes. |
caugner
force-pushed
the
configurable-compat-table-browsers
branch
from
September 10, 2026 18:22
6abe6d0 to
5ff1261
Compare
caugner
changed the title
Expose `closedby` and `--modal-max-width` for dialog customization. Forward `close` across the shadow boundary so callers can revert previews. Align the title with content and apply heading typography.
Contributor
Author
|
Last commit before the history rewrite: b36dfc1 This commit preserves the original commit chain for recovery. |
caugner
force-pushed
the
configurable-compat-table-browsers
branch
from
September 11, 2026 11:42
b36dfc1 to
3093964
Compare
Persist per-browser visibility under the `compat-table` storage key. Browsers without saved choices follow defaults; resetting preserves unrelated settings. Sync values across tables and tabs via events and `BroadcastChannel`. Include values in notifications to avoid stale storage reads. Resolve visible platforms and browsers with explicit exclusion reasons. Cover defaults, overrides, runtime data, and WebExtensions with unit tests.
Cap browser columns at `4rem` across desktop breakpoints and let the feature column fill remaining space. Keep positioned cell content contained and remove the unused pseudo-element.
Add browser toggle pills grouped by platform, with separate rows for Baseline browsers, WebViews, and remaining browsers. Preview choices on the current table; persist on Save and revert on Cancel, close, or Escape. Allow any selection, including none, and clear saved overrides when the selection matches defaults. Explain unavailable browser columns with icons and a legend. Include fallback browser icons, localized labels, and an empty-selection note.
Measure shown browser columns alongside table views, using `default` when no custom visibility is saved. Measure dialog opens and actual visibility changes on Save. Emit `reset` before per-browser changes when restoring the default selection.
caugner
force-pushed
the
configurable-compat-table-browsers
branch
from
September 11, 2026 13:26
3093964 to
db4bd43
Compare
caugner
marked this pull request as ready for review
September 11, 2026 14:52
LeoMcA
approved these changes
Sep 18, 2026
LeoMcA
left a comment
LeoMcA
left a comment
Member
There was a problem hiding this comment.
Really really nice!
I think generally we should aim to elevate things to top level /** @imports after a couple of uses inline, and the readability of most of the files here would benefit from that - but consider those nits.
The modal click-to-dismiss and testing file names are the only real question/concern I have.
Replace repeated inline type expressions with top-level `@import` declarations to keep annotations concise.
Replace repeated inline type expressions with top-level `@import` declarations to keep the helper annotations concise.
Mirror the component source tree so each test file target is unambiguous.
caugner
changed the title
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
4 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Description
Add browser visibility controls to compatibility tables.
Motivation
Help readers configure compatibility tables for their needs.
Additional details
mdn-modalwith configurable dismissal and width, a forwarded close event, and heading typography.Screenshot
Measurements
New Glean measurements:
bcd: browsers -> defaultorbcd: browsers -> <browser>,<browser>,...: on table view, reportdefaultwithout saved overrides; otherwise list shown columns by BCD key in table order.bcd: settings -> open: on opening the modal.bcd: settings -> show <browser>/bcd: settings -> hide <browser>: on Save, once per changed browser.bcd: settings -> reset: before per-browser events when a changed selection is saved as defaults.Related issues and pull requests
Fixes mdn/mdn#752.