Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(compat): migrate BCD table to Web Component #12580

Merged
merged 69 commits into from
Mar 20, 2025
Merged
Changes from 1 commit
Commits
Show all changes
69 commits
Select commit Hold shift + click to select a range
c2e9578
feat(client): implement basic BCD lit
caugner Feb 3, 2025
ed9d21e
feat(compat): implement BCD table with notes
caugner Feb 5, 2025
cc0ba8a
refactor(compat): pass down {compat,browserInfo}
caugner Feb 5, 2025
2fa2c32
feat(compat): use popover
caugner Feb 5, 2025
aafc2a6
fix(compat): improve popover
caugner Feb 5, 2025
29e5b42
fix(compat): replace React syntax
caugner Mar 10, 2025
9f1ddc1
chore(compat): pull BCD heading out
caugner Mar 10, 2025
813778c
refactor(compat): convert TS to JS with JSDoc
caugner Mar 10, 2025
77a3e7c
fix(compat): refine look&feel
caugner Mar 11, 2025
c8fe15f
fix(compat): improve grid-template-columns
caugner Mar 11, 2025
52e5b39
chore(compat): improve/consolidate mobile style
caugner Mar 11, 2025
d4c5fe2
fix(compat): add tabindex on more/timeline
caugner Mar 11, 2025
bb358a0
chore(compat): simplify grid-column
caugner Mar 11, 2025
c2b8c55
refactor(compat): merge grid.scss
caugner Mar 11, 2025
b199d01
fix(compat): restore depth border
caugner Mar 11, 2025
a74b0ed
chore(compat): port https://github.com/mdn/yari/pull/12303
caugner Mar 11, 2025
59d0b84
enhance(compat): omit trailing ".0" (esp. Node.js)
caugner Mar 11, 2025
4d558f8
chore(compat): remove whitespace before support note
caugner Mar 11, 2025
f188d88
enhance(compat): show browser name in timeline
caugner Mar 11, 2025
314d142
refactor(compat): rename .{more => timeline}
caugner Mar 11, 2025
e6733ea
enhance(compat): open issue form via window.open() to reduce spam
caugner Mar 11, 2025
9ecf9f8
chore(compat): ignore default-case
caugner Mar 11, 2025
065efa3
enhance(compat): add "Show data on GitHub" link
caugner Mar 11, 2025
ae04022
fix(compat): support collapsing timeline
caugner Mar 11, 2025
c61bdc4
chore(compat): ignore some TS errors
caugner Mar 11, 2025
9df6e2a
refactor(compat): replace several @typedef with @import
caugner Mar 13, 2025
600e391
refactor(compat): remove unnecessary inline imports
caugner Mar 13, 2025
b9b5673
refactor(compat): rename [Lazy]{Bcd => Compat}Table
caugner Mar 13, 2025
b8b0328
fix(compat): prefix internal state with `_`
caugner Mar 13, 2025
5b67a10
fix(compat): migrate to @lit/task
caugner Mar 13, 2025
b720443
fix(compat): apply global link style
caugner Mar 14, 2025
1881485
chore(updates): reuse lit compat table
caugner Mar 14, 2025
7a881a0
refactor(updates): inline browserToIconName()
caugner Mar 14, 2025
e0be828
chore(client): remove old browser-compatibility-table
caugner Mar 14, 2025
0318379
chore(compat): remove data-test attribute
caugner Mar 17, 2025
45e0ef8
chore(compat): refine icon positioning
caugner Mar 17, 2025
9172280
fix(compat): use partial icon in timeline
caugner Mar 17, 2025
726b87e
chore(compat): remove duplicate browser.name
caugner Mar 17, 2025
3450ea2
fix(compat): show preview version in timeline without release date
caugner Mar 17, 2025
1206cde
enhance(compat): render timeline for unknown support
caugner Mar 17, 2025
19beb02
fix(compat): show unknown in legend
caugner Mar 17, 2025
25fd4dc
enhance(compat): move GitHub links in scroll container
caugner Mar 17, 2025
1ec7ff8
chore(compat): make feature column wider on xl screens
caugner Mar 17, 2025
85437eb
chore(compat): remove unused .bc-history styles
caugner Mar 17, 2025
39c5ca6
fix(compat): fix timeline entry for flags
caugner Mar 17, 2025
32dbc51
chore(compat): remove unused aria-expanded style
caugner Mar 17, 2025
868d441
fix(compat): work around cut icon at the top
caugner Mar 17, 2025
51ae454
fix(compat): merge .bc-supports styles
caugner Mar 17, 2025
8bb9870
chore(compat): remove unused style
caugner Mar 17, 2025
445a7f4
enhance(atoms/icon): introduce --icon-color variable
caugner Mar 17, 2025
a8a9f4f
Revert "enhance(atoms/icon): introduce --icon-color variable"
caugner Mar 17, 2025
dfd73af
Revert "fix(compat): merge .bc-supports styles"
caugner Mar 17, 2025
857de5f
fix(compat): move .bc-supports-no below .bc-supports-partial
caugner Mar 17, 2025
1536f1b
chore(compat): separate features in xs view
caugner Mar 17, 2025
1a54bae
chore(compat): improve links in xs view
caugner Mar 17, 2025
6a15c3f
fix(compat): calculate breakpoint with SCSS
caugner Mar 17, 2025
707e502
fix(compat): show "Support unknown" in timeline
caugner Mar 17, 2025
dbc84b6
fix(compat): focus explicitly on click
caugner Mar 18, 2025
09025b6
fix(compat): fix header layout
caugner Mar 18, 2025
81de805
fix(compat): avoid left border in timeline cell
caugner Mar 18, 2025
f73e2e2
fixup! fix(compat): focus explicitly on click
caugner Mar 18, 2025
759eb44
fix(compat): fix types, removing unnecessary @ts-ignore
LeoMcA Mar 19, 2025
8d25034
chore(compat): remove unused _id
caugner Mar 19, 2025
a2765ef
chore(compat): type BCD response.json()
caugner Mar 19, 2025
33a7958
chore(compat): remove TODO
caugner Mar 19, 2025
503c2c6
refactor(compat): prefix internal getters/methods
caugner Mar 19, 2025
2f659ab
fix(compat): replace className => class
caugner Mar 19, 2025
7b8bece
chore(compat): use ifDefined directive
caugner Mar 19, 2025
2b4edfd
fix(compat): add external link style
caugner Mar 20, 2025
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
fix(compat): fix types, removing unnecessary @ts-ignore
LeoMcA committed Mar 19, 2025
commit 759eb44b1f1685c8df9955663c4ea3479fd19f19
3 changes: 1 addition & 2 deletions client/src/lit/compat/feature-row.js
Original file line number Diff line number Diff line change
@@ -3,7 +3,7 @@ import { html } from "lit";

/**
* @import { BrowserStatement } from "@mdn/browser-compat-data/types"
* @import { SupportStatementExtended } from "./utils.js"
* @import { SupportStatementExtended } from "./types"
* @typedef {"no"|"yes"|"partial"|"preview"|"removed-partial"|"unknown"} SupportClassName
*/

@@ -101,6 +101,5 @@ export function getSupportBrowserReleaseDate(support) {
return undefined;
}

// @ts-ignore
return getCurrentSupport(support)?.release_date;
}
10 changes: 2 additions & 8 deletions client/src/lit/compat/legend.js
Original file line number Diff line number Diff line change
@@ -62,7 +62,6 @@ export function getActiveLegendItems(compat, name, browserInfo, browsers) {
}

for (const browser of browsers) {
// @ts-ignore
const browserSupport = feature.compat.support[browser] ?? {
version_added: null,
};
@@ -71,9 +70,8 @@ export function getActiveLegendItems(compat, name, browserInfo, browsers) {
continue;
}

// @ts-ignore
const firstSupportItem = getFirst(browserSupport);
if (hasNoteworthyNotes(firstSupportItem)) {
if (firstSupportItem && hasNoteworthyNotes(firstSupportItem)) {
legendItems.add("footnote");
}

@@ -82,7 +80,6 @@ export function getActiveLegendItems(compat, name, browserInfo, browsers) {
if (versionSupport.flags && versionSupport.flags.length) {
legendItems.add("no");
} else if (
// @ts-ignore
versionIsPreview(versionSupport.version_added, browserInfo[browser])
) {
legendItems.add("preview");
@@ -115,10 +112,7 @@ export function getActiveLegendItems(compat, name, browserInfo, browsers) {
}
}

/**
* @type {any[]}
*/
const keys = Object.keys(LEGEND_LABELS);
const keys = /** @type {LegendKey[]} */ (Object.keys(LEGEND_LABELS));

return keys
.filter((key) => legendItems.has(key))
17 changes: 17 additions & 0 deletions client/src/lit/compat/types.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
import type BCD from "@mdn/browser-compat-data/types";

// Extended for the fields, beyond the bcd types, that are extra-added
// exclusively in Yari.
export interface SimpleSupportStatementExtended
extends BCD.SimpleSupportStatement {
// Known for some support statements where the browser *version* is known,
// as opposed to just "true" and if the version release date is known.
release_date?: string;
// The version before the version_removed if the *version* removed is known,
// as opposed to just "true". Otherwise the version_removed.
version_last?: BCD.VersionValue;
}

export type SupportStatementExtended =
| SimpleSupportStatementExtended
| SimpleSupportStatementExtended[];
17 changes: 3 additions & 14 deletions client/src/lit/compat/utils.js
Original file line number Diff line number Diff line change
@@ -1,16 +1,6 @@
/**
* @import { SimpleSupportStatement, VersionValue, CompatStatement, Identifier, SupportStatement, BrowserStatement } from "@mdn/browser-compat-data/types"
* @typedef {SimpleSupportStatementExtended | SimpleSupportStatementExtended[]} SupportStatementExtended
*/

/**
* Extended for the fields, beyond the bcd types, that are extra-added exclusively in Yari.
*
* Inherits all properties from SimpleSupportStatement.
*
* @typedef {SimpleSupportStatement} SimpleSupportStatementExtended
* @property {string} [release_date] - Known for some support statements where the browser version is known.
* @property {VersionValue} [version_last] - The version before the version_removed if the version removed is known.
* @import { SupportStatementExtended, SimpleSupportStatementExtended } from "./types"
*/

/**
@@ -33,8 +23,8 @@ export const HIDDEN_BROWSERS = ["ie"];
* Gets the first element of an array or returns the value itself.
*
* @template T
* @param {T | [T, ...any[]]} a
* @returns {T}
* @param {T | [T?, ...any[]]} a
* @returns {T | undefined}
*/
export function getFirst(a) {
return Array.isArray(a) ? a[0] : a;
@@ -308,6 +298,5 @@ export function getCurrentSupport(support) {
if (noSupportItem) return noSupportItem;

// Default (likely never reached).
// @ts-ignore
return getFirst(support);
}