From 3a24cda4351057e491c99e1030b6339c3df579f1 Mon Sep 17 00:00:00 2001 From: Tony Conway Date: Fri, 4 Apr 2025 17:03:38 +0100 Subject: [PATCH 1/8] Adds new package.json config option with README explainer --- README.md | 90 +++++++++++++++++++++++++++++++- index.js | 6 ++- package.json | 2 +- scripts/get-baseline-versions.js | 20 ++++--- scripts/handle-config.js | 12 +++++ 5 files changed, 120 insertions(+), 10 deletions(-) create mode 100644 scripts/handle-config.js diff --git a/README.md b/README.md index 9d66cc9..cc72f20 100644 --- a/README.md +++ b/README.md @@ -35,6 +35,22 @@ To target Baseline Widely Available, add the following to your `package.json`: } ``` +If you want to see your list of chosen browsers every time `browserslist` calls `browserslist-baseline-config`, add a `browserslist-config-baseline` object to your `package.json` with `logConfigToConsole` set to `true`: + + +```json +{ + "browserslist": [ + "extends browserslist-config-baseline" + ], + "browserslist-config-baseline": { + "logConfigToConsole": true + } +} +``` + +The `logConfigToConsole` option works with both of the target configuration options mentioned below. + The data in this package changes frequently as new browser versions are released and new web-features become interoperable. Consider updating this module regularly by adding one of these commands to your build scripts: ```sh @@ -50,7 +66,16 @@ bun update browserslist-config-baseline@latest If you haven't updated `browserslist-config-baseline` in the last month and you are targeting Widely Available, the package will check for updates whenever you run a `browserslist`-compatible tool and prompt you to upgrade if there is a new version available. -## Baseline year feature sets +## Configuring `browserslist-config-baseline` + +There are two ways to configure `browserslist-config-basesline`: + +- [Add options to the end of your `extends` statement](#configuring-targets-using-the-extends-statement). +- Using a `browserslist-config-baseline` configuration object in your `package.json`. + +## Configuring targets using the `extends` statement + +### Baseline year feature sets Baseline year feature sets include all the web platform features that were fully supported in the core browser set at the end of a given calendar year. To use a Baseline year feature set, add the year in the format `/YYYY` to the end of your `extends` statement: @@ -81,7 +106,7 @@ This equates to the following `browserslist` config: The minimum browser versions that support these feature sets are usually the last version released in that year or a few versions earlier. The feature set > browser version mappings in this module were determined using [`baseline-browser-mapping`](https://npmjs.org/baseline-browser-mapping). -## Include Chromium downstream browsers +### Include Chromium downstream browsers To include browsers that implement Chromium where possible, insert `/with-downstream` into your `extends` statement immediately after the package name: @@ -118,6 +143,67 @@ This equates to the following `browserslist` config: The minimum browser versions of non-core browsers are provided by `baseline-browser-mapping` based on two sources: [`@mdn/browser-compat-data`](https://npmjs.org/@mdn/browsers-compat-data) where those engine version mappings exist, and parsed user agents from [`useragents.io`](https://useragents.io) where necessary. For more information on these mappings, please see [`baseline-browser-mapping`'s README](https://www.npmjs.com/package/baseline-browser-mapping#downstream-browsers). +## Configuring targets using a `browserslist-config-baseline` object in `package.json` + +You can add a `browserslist-config-baseline` object to your `package.json` to set your Baseline target. + +> **NOTE** +> The `browserslist-config-baseline` config in `package.json` only works if you use the basic `extends` statement. If you add a `YYYY` year and/or `with-downstream` to your `extends` statement, that will take precedence over the target settings in your `browserslist-config-baseline` object. The `logConfigToConsole` option works with both config methods. + +### Target Baseline year feature sets + +To target a Baseline year, set the `targetYear` property to the desired year: + + +```json +{ + "browserslist": [ + "extends browserslist-config-baseline" + ], + "browserslist-config-baseline": { + "targetYear": 2020 + } +} +``` + +> **NOTE** +> You cannot use the `targetYear` and `widelyAvailableOnDate` options together. The `baseline-browser-mapping` module that supplies data to `browserslist-config-baseline` will throw an error. + +### Target Baseline Widely available on a particular date + +To target Baseline Widely available on a particular date, set the `widelyAvailableOnDate` property to the desired date in the format `YYYY-MM-DD`: + + +```json +{ + "browserslist": [ + "extends browserslist-config-baseline" + ], + "browserslist-config-baseline": { + "widelyAvailableOnDate": "2020-06-01" + } +} +``` + +> **NOTE** +> You cannot use the `targetYear` and `widelyAvailableOnDate` options together. The `baseline-browser-mapping` module that supplies data to `browserslist-config-baseline` will throw an error. + +### Include downstream browsers + +To include browsers the implement Chromium, set the `includeDownstreamBrowsers` property to `true`: + + +```json +{ + "browserslist": [ + "extends browserslist-config-baseline" + ], + "browserslist-config-baseline": { + "includeDownstreamBrowsers": true + } +} +``` + ## See also - [WebDX Baseline specification](https://github.com/web-platform-dx/web-features/blob/main/docs/baseline.md) diff --git a/index.js b/index.js index fde9d92..7a0e044 100644 --- a/index.js +++ b/index.js @@ -1,5 +1,9 @@ +const options = require("./scripts/handle-config"); + const getBaselineVersions = require("./scripts/get-baseline-versions"); -module.exports = getBaselineVersions(); +const targetVersions = getBaselineVersions(options); + +module.exports = targetVersions; const compareVersions = require("./scripts/compare-versions-warning"); compareVersions(); diff --git a/package.json b/package.json index af9d438..ec32fc1 100644 --- a/package.json +++ b/package.json @@ -31,7 +31,7 @@ }, "dependencies": { "@httptoolkit/esm": "^3.3.1", - "baseline-browser-mapping": "^2.1.0", + "baseline-browser-mapping": "^2.2.0", "compare-versions": "^6.1.1" } } diff --git a/scripts/get-baseline-versions.js b/scripts/get-baseline-versions.js index e6b9c76..2ef3ddb 100644 --- a/scripts/get-baseline-versions.js +++ b/scripts/get-baseline-versions.js @@ -1,6 +1,10 @@ require = require("@httptoolkit/esm")(module); bbm = require("baseline-browser-mapping"); +const packageJson = require(process.cwd() + "/package.json"); +const incomingConfig = packageJson["browserslist-config-baseline"] ?? {}; +let logConfigToConsole = incomingConfig.logConfigToConsole ?? false; + let transform = function (bbm_versions) { var browsers = { chrome: "Chrome", @@ -24,10 +28,14 @@ let transform = function (bbm_versions) { }; module.exports = function (config = {}) { - return transform( - bbm.getCompatibleVersions({ - targetYear: config.targetYear, - includeDownstreamBrowsers: config.includeDownstreamBrowsers, - }), - ); + let listToReturn = transform(bbm.getCompatibleVersions(config)); + + if (logConfigToConsole) { + console.log( + "Your browserslit config from browserslist-config-baseline is:\n", + listToReturn, + ); + } + + return listToReturn; }; diff --git a/scripts/handle-config.js b/scripts/handle-config.js new file mode 100644 index 0000000..f02eb26 --- /dev/null +++ b/scripts/handle-config.js @@ -0,0 +1,12 @@ +const packageJson = require(process.cwd() + "/package.json"); + +const incomingConfig = packageJson["browserslist-config-baseline"] ?? {}; + +let options = { + includeDownstreamBrowsers: incomingConfig.includeDownstreamBrowsers ?? false, +}; +if (incomingConfig.widelyAvailableOnDate) + options.widelyAvailableOnDate = incomingConfig.widelyAvailableOnDate; +if (incomingConfig.targetYear) options.targetYear = incomingConfig.targetYear; + +module.exports = options; From e12c14e7d0dd3ffdd07a8629b4a71ecaad2a05e9 Mon Sep 17 00:00:00 2001 From: Tony Conway Date: Sun, 6 Apr 2025 14:49:05 +0100 Subject: [PATCH 2/8] Update scripts/get-baseline-versions.js Better syntax for merging config objects, thanks @notpushkin Co-authored-by: Alexander Pushkov --- scripts/get-baseline-versions.js | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/scripts/get-baseline-versions.js b/scripts/get-baseline-versions.js index 2ef3ddb..a76eeb7 100644 --- a/scripts/get-baseline-versions.js +++ b/scripts/get-baseline-versions.js @@ -28,7 +28,10 @@ let transform = function (bbm_versions) { }; module.exports = function (config = {}) { - let listToReturn = transform(bbm.getCompatibleVersions(config)); + const versions = bbm.getCompatibleVersions( + Object.assign({}, incomingConfig, config) + ); + const listToReturn = transform(versions); if (logConfigToConsole) { console.log( From 198cd35e6d6d53676cc250c61794882055f4e793 Mon Sep 17 00:00:00 2001 From: Tony Conway Date: Mon, 7 Apr 2025 09:55:27 +0100 Subject: [PATCH 3/8] Update scripts/get-baseline-versions.js Update logic for retrieving package.json Co-authored-by: Alexander Pushkov --- scripts/get-baseline-versions.js | 18 ++++++++++++++++-- 1 file changed, 16 insertions(+), 2 deletions(-) diff --git a/scripts/get-baseline-versions.js b/scripts/get-baseline-versions.js index a76eeb7..b49bc4d 100644 --- a/scripts/get-baseline-versions.js +++ b/scripts/get-baseline-versions.js @@ -1,8 +1,22 @@ require = require("@httptoolkit/esm")(module); bbm = require("baseline-browser-mapping"); -const packageJson = require(process.cwd() + "/package.json"); -const incomingConfig = packageJson["browserslist-config-baseline"] ?? {}; +const fs = require("fs"); +const path = require("path"); + +function readConfig(loc, name) { + do { + try { + const pkg = require(path.join(loc, "package.json")); + if (pkg.hasOwnProperty(name)) return pkg[name]; + } catch {} + } while (loc !== (loc = path.dirname(loc))); + + return null; +} + +const incomingConfig = + readConfig(process.cwd(), "browserslist-config-baseline") ?? {}; let logConfigToConsole = incomingConfig.logConfigToConsole ?? false; let transform = function (bbm_versions) { From daba76f49cbef796878241ee1d9e345aba0d1300 Mon Sep 17 00:00:00 2001 From: Tony Conway Date: Mon, 7 Apr 2025 16:53:48 +0100 Subject: [PATCH 4/8] consolidates config handling into get-baseline-versions.js and reports conflicting configs between extends and package.json --- index.js | 6 +-- scripts/get-baseline-versions.js | 86 +++++++++++++++++++++++++++----- scripts/handle-config.js | 12 ----- 3 files changed, 75 insertions(+), 29 deletions(-) delete mode 100644 scripts/handle-config.js diff --git a/index.js b/index.js index 7a0e044..6b6ca07 100644 --- a/index.js +++ b/index.js @@ -1,9 +1,5 @@ -const options = require("./scripts/handle-config"); - const getBaselineVersions = require("./scripts/get-baseline-versions"); -const targetVersions = getBaselineVersions(options); - -module.exports = targetVersions; +module.exports = getBaselineVersions(options); const compareVersions = require("./scripts/compare-versions-warning"); compareVersions(); diff --git a/scripts/get-baseline-versions.js b/scripts/get-baseline-versions.js index b49bc4d..9cb98eb 100644 --- a/scripts/get-baseline-versions.js +++ b/scripts/get-baseline-versions.js @@ -15,12 +15,8 @@ function readConfig(loc, name) { return null; } -const incomingConfig = - readConfig(process.cwd(), "browserslist-config-baseline") ?? {}; -let logConfigToConsole = incomingConfig.logConfigToConsole ?? false; - -let transform = function (bbm_versions) { - var browsers = { +function transform(bbm_versions) { + const browsers = { chrome: "Chrome", chrome_android: "ChromeAndroid", edge: "Edge", @@ -39,15 +35,81 @@ let transform = function (bbm_versions) { return bbm_versions .filter((version) => Object.keys(browsers).includes(version.browser)) .map((version) => `${browsers[version.browser]} >= ${version.version}`); -}; +} + +function reconcileConfigs(extendsConfig) { + const bbmConfig = {}; + + const pkgConfig = + readConfig(process.cwd(), "browserslist-config-baseline") ?? {}; + + console.log(pkgConfig); + + // Check to see if there are two configured target years + if (pkgConfig.targetYear && extendsConfig.targetYear) { + bbmConfig.targetYear = Math.min( + pkgConfig.targetYear, + extendsConfig.targetYear, + ); + + console.warn( + `[browserslist-config-baseline] You’ve set targetYear: ` + + `${pkgConfig.targetYear} in your package.json, but extended this ` + + `config as \`browserslist-config-baseline/${extendsConfig.targetYear}\`. ` + + `Proceeding with the lower option, targetYear: ${bbmConfig.targetYear}. ` + + `Remove targetYear in package.json or use \`extend browserslist-config-baseline\` ` + + `to suppress this warning.`, + ); + } + + // Check to see if widelyAvailableOnDate is being used alongside extends .../YYYY + if (pkgConfig.widelyAvailableOnDate && extendsConfig.targetYear) { + const widelyAvailableOnDate = new Date(pkgConfig.widelyAvailableOnDate); + const targetYear = new Date(extendsConfig.targetYear + "-12-31"); + + let stringFragment = + widelyAvailableOnDate < targetYear + ? `Proceeding with the lower option, widelyAvailableOnDate: ${pkgConfig.widelyAvailableOnDate}.\n` + : `Proceeding with the lower option, targetYear: ${extendsConfig.targetYear}.\n`; + + console.warn( + `[browserslist-config-baseline] You’ve set widelyAvailableOnDate: ` + + `"${pkgConfig.widelyAvailableOnDate}" in your package.json, but extended this ` + + `config as \`browserslist-config-baseline/${extendsConfig.targetYear}\`.\n` + + stringFragment + + `Remove widelyAvailableOnDate in package.json or use \`extend browserslist-config-baseline\` ` + + `to suppress this warning.`, + ); + } + + // Check to see if extends and package have conflicting includeDownstreamBrowsers + if ( + extendsConfig.includeDownstreamBrowsers && + pkgConfig.includeDownstreamBrowsers === false + ) { + console.warn( + `[browserslist-config-baseline]` + + `You've extended your browserslist config using \`/with-downstream\` ` + + `but set includeDownstreamBrowsers: false in package.json.\n` + + `Proceeding with includeDownstreamBrowsers: false.\n` + + `Remove includeDownstreamBrowsers: false in package.json or use` + + `\`extend browserslist-config-baseline\` to suppress this warning.`, + ); + bbmConfig.includeDownstreamBrowsers = false; + } + + return { + bbmConfig: bbmConfig, + logConfigToConsole: pkgConfig.logConfigToConsole ?? false, + }; +} -module.exports = function (config = {}) { - const versions = bbm.getCompatibleVersions( - Object.assign({}, incomingConfig, config) - ); +module.exports = function (extendsConfig = {}) { + const config = reconcileConfigs(extendsConfig); + const versions = bbm.getCompatibleVersions(config.bbmConfig); const listToReturn = transform(versions); - if (logConfigToConsole) { + if (config.logConfigToConsole) { console.log( "Your browserslit config from browserslist-config-baseline is:\n", listToReturn, diff --git a/scripts/handle-config.js b/scripts/handle-config.js deleted file mode 100644 index f02eb26..0000000 --- a/scripts/handle-config.js +++ /dev/null @@ -1,12 +0,0 @@ -const packageJson = require(process.cwd() + "/package.json"); - -const incomingConfig = packageJson["browserslist-config-baseline"] ?? {}; - -let options = { - includeDownstreamBrowsers: incomingConfig.includeDownstreamBrowsers ?? false, -}; -if (incomingConfig.widelyAvailableOnDate) - options.widelyAvailableOnDate = incomingConfig.widelyAvailableOnDate; -if (incomingConfig.targetYear) options.targetYear = incomingConfig.targetYear; - -module.exports = options; From ebdb2adec24519071ba5fc04d877c4773c422bb9 Mon Sep 17 00:00:00 2001 From: Tony Conway Date: Mon, 7 Apr 2025 16:56:05 +0100 Subject: [PATCH 5/8] remove unneeded console.log --- scripts/get-baseline-versions.js | 2 -- 1 file changed, 2 deletions(-) diff --git a/scripts/get-baseline-versions.js b/scripts/get-baseline-versions.js index 9cb98eb..d85848f 100644 --- a/scripts/get-baseline-versions.js +++ b/scripts/get-baseline-versions.js @@ -43,8 +43,6 @@ function reconcileConfigs(extendsConfig) { const pkgConfig = readConfig(process.cwd(), "browserslist-config-baseline") ?? {}; - console.log(pkgConfig); - // Check to see if there are two configured target years if (pkgConfig.targetYear && extendsConfig.targetYear) { bbmConfig.targetYear = Math.min( From d997c6269dabc73ecd2ac7eb2c6ad88c466226f2 Mon Sep 17 00:00:00 2001 From: Tony Conway Date: Mon, 7 Apr 2025 17:07:21 +0100 Subject: [PATCH 6/8] Fixes logic issues with widelyAvailableOnDate --- scripts/get-baseline-versions.js | 22 ++++++++++++++++------ 1 file changed, 16 insertions(+), 6 deletions(-) diff --git a/scripts/get-baseline-versions.js b/scripts/get-baseline-versions.js index d85848f..d905e11 100644 --- a/scripts/get-baseline-versions.js +++ b/scripts/get-baseline-versions.js @@ -63,12 +63,17 @@ function reconcileConfigs(extendsConfig) { // Check to see if widelyAvailableOnDate is being used alongside extends .../YYYY if (pkgConfig.widelyAvailableOnDate && extendsConfig.targetYear) { const widelyAvailableOnDate = new Date(pkgConfig.widelyAvailableOnDate); - const targetYear = new Date(extendsConfig.targetYear + "-12-31"); + const targetYearDate = new Date(extendsConfig.targetYear + "-12-31"); - let stringFragment = - widelyAvailableOnDate < targetYear - ? `Proceeding with the lower option, widelyAvailableOnDate: ${pkgConfig.widelyAvailableOnDate}.\n` - : `Proceeding with the lower option, targetYear: ${extendsConfig.targetYear}.\n`; + let stringFragment = ""; + + if (widelyAvailableOnDate < targetYearDate) { + bbmConfig.widelyAvailableOnDate = pkgConfig.widelyAvailableOnDate; + stringFragment += `Proceeding with the lower option, widelyAvailableOnDate: ${pkgConfig.widelyAvailableOnDate}.\n`; + } else { + bbmConfig.targetYear = extendsConfig.targetYear; + stringFragment += `Proceeding with the lower option, targetYear: ${extendsConfig.targetYear}.\n`; + } console.warn( `[browserslist-config-baseline] You’ve set widelyAvailableOnDate: ` + @@ -80,11 +85,16 @@ function reconcileConfigs(extendsConfig) { ); } + if (pkgConfig.widelyAvailableOnDate && !extendsConfig.targetYear) { + bbmConfig.widelyAvailableOnDate = pkgConfig.widelyAvailableOnDate; + } + // Check to see if extends and package have conflicting includeDownstreamBrowsers if ( extendsConfig.includeDownstreamBrowsers && pkgConfig.includeDownstreamBrowsers === false ) { + bbmConfig.includeDownstreamBrowsers = false; console.warn( `[browserslist-config-baseline]` + `You've extended your browserslist config using \`/with-downstream\` ` + @@ -93,7 +103,6 @@ function reconcileConfigs(extendsConfig) { `Remove includeDownstreamBrowsers: false in package.json or use` + `\`extend browserslist-config-baseline\` to suppress this warning.`, ); - bbmConfig.includeDownstreamBrowsers = false; } return { @@ -104,6 +113,7 @@ function reconcileConfigs(extendsConfig) { module.exports = function (extendsConfig = {}) { const config = reconcileConfigs(extendsConfig); + const versions = bbm.getCompatibleVersions(config.bbmConfig); const listToReturn = transform(versions); From 4429aea58610e4a9db0dba6805e7bdc9ded26c08 Mon Sep 17 00:00:00 2001 From: Tony Conway Date: Tue, 8 Apr 2025 10:34:17 +0100 Subject: [PATCH 7/8] renames targetYear to baselineYear, adds missing logic for correct configurations --- 2016.js | 2 +- 2017.js | 2 +- 2018.js | 2 +- 2019.js | 2 +- 2020.js | 2 +- 2021.js | 2 +- 2022.js | 2 +- 2023.js | 2 +- 2024.js | 2 +- README.md | 8 ++-- index.js | 2 +- scripts/get-baseline-versions.js | 76 +++++++++++++++++++------------- with-downstream/2016.js | 2 +- with-downstream/2017.js | 2 +- with-downstream/2018.js | 2 +- with-downstream/2019.js | 2 +- with-downstream/2020.js | 2 +- with-downstream/2021.js | 2 +- with-downstream/2022.js | 2 +- with-downstream/2023.js | 2 +- with-downstream/2024.js | 2 +- 21 files changed, 69 insertions(+), 53 deletions(-) diff --git a/2016.js b/2016.js index af7bd3b..8a8cb91 100644 --- a/2016.js +++ b/2016.js @@ -1,2 +1,2 @@ const getBaselineVersions = require("./scripts/get-baseline-versions"); -module.exports = getBaselineVersions({ targetYear: 2016 }); +module.exports = getBaselineVersions({ baselineYear: 2016 }); diff --git a/2017.js b/2017.js index b747d4b..68890ca 100644 --- a/2017.js +++ b/2017.js @@ -1,2 +1,2 @@ const getBaselineVersions = require("./scripts/get-baseline-versions"); -module.exports = getBaselineVersions({ targetYear: 2017 }); +module.exports = getBaselineVersions({ baselineYear: 2017 }); diff --git a/2018.js b/2018.js index 60bc7da..b44edd8 100644 --- a/2018.js +++ b/2018.js @@ -1,2 +1,2 @@ const getBaselineVersions = require("./scripts/get-baseline-versions"); -module.exports = getBaselineVersions({ targetYear: 2018 }); +module.exports = getBaselineVersions({ baselineYear: 2018 }); diff --git a/2019.js b/2019.js index 57cb20f..7bc72c5 100644 --- a/2019.js +++ b/2019.js @@ -1,2 +1,2 @@ const getBaselineVersions = require("./scripts/get-baseline-versions"); -module.exports = getBaselineVersions({ targetYear: 2019 }); +module.exports = getBaselineVersions({ baselineYear: 2019 }); diff --git a/2020.js b/2020.js index 4dad364..aca52eb 100644 --- a/2020.js +++ b/2020.js @@ -1,2 +1,2 @@ const getBaselineVersions = require("./scripts/get-baseline-versions"); -module.exports = getBaselineVersions({ targetYear: 2020 }); +module.exports = getBaselineVersions({ baselineYear: 2020 }); diff --git a/2021.js b/2021.js index a81df09..ce0de96 100644 --- a/2021.js +++ b/2021.js @@ -1,2 +1,2 @@ const getBaselineVersions = require("./scripts/get-baseline-versions"); -module.exports = getBaselineVersions({ targetYear: 2021 }); +module.exports = getBaselineVersions({ baselineYear: 2021 }); diff --git a/2022.js b/2022.js index 71ed930..00bd2fa 100644 --- a/2022.js +++ b/2022.js @@ -1,2 +1,2 @@ const getBaselineVersions = require("./scripts/get-baseline-versions"); -module.exports = getBaselineVersions({ targetYear: 2022 }); +module.exports = getBaselineVersions({ baselineYear: 2022 }); diff --git a/2023.js b/2023.js index a27a3f8..73b0628 100644 --- a/2023.js +++ b/2023.js @@ -1,2 +1,2 @@ const getBaselineVersions = require("./scripts/get-baseline-versions"); -module.exports = getBaselineVersions({ targetYear: 2023 }); +module.exports = getBaselineVersions({ baselineYear: 2023 }); diff --git a/2024.js b/2024.js index bfc90d5..58d961c 100644 --- a/2024.js +++ b/2024.js @@ -1,2 +1,2 @@ const getBaselineVersions = require("./scripts/get-baseline-versions"); -module.exports = getBaselineVersions({ targetYear: 2024 }); +module.exports = getBaselineVersions({ baselineYear: 2024 }); diff --git a/README.md b/README.md index cc72f20..c717631 100644 --- a/README.md +++ b/README.md @@ -152,7 +152,7 @@ You can add a `browserslist-config-baseline` object to your `package.json` to se ### Target Baseline year feature sets -To target a Baseline year, set the `targetYear` property to the desired year: +To target a Baseline year, set the `baselineYear` property to the desired year: ```json @@ -161,13 +161,13 @@ To target a Baseline year, set the `targetYear` property to the desired year: "extends browserslist-config-baseline" ], "browserslist-config-baseline": { - "targetYear": 2020 + "baselineYear": 2020 } } ``` > **NOTE** -> You cannot use the `targetYear` and `widelyAvailableOnDate` options together. The `baseline-browser-mapping` module that supplies data to `browserslist-config-baseline` will throw an error. +> You cannot use the `baselineYear` and `widelyAvailableOnDate` options together. The `baseline-browser-mapping` module that supplies data to `browserslist-config-baseline` will throw an error. ### Target Baseline Widely available on a particular date @@ -186,7 +186,7 @@ To target Baseline Widely available on a particular date, set the `widelyAvailab ``` > **NOTE** -> You cannot use the `targetYear` and `widelyAvailableOnDate` options together. The `baseline-browser-mapping` module that supplies data to `browserslist-config-baseline` will throw an error. +> You cannot use the `baselineYear` and `widelyAvailableOnDate` options together. The `baseline-browser-mapping` module that supplies data to `browserslist-config-baseline` will throw an error. ### Include downstream browsers diff --git a/index.js b/index.js index 6b6ca07..fde9d92 100644 --- a/index.js +++ b/index.js @@ -1,5 +1,5 @@ const getBaselineVersions = require("./scripts/get-baseline-versions"); -module.exports = getBaselineVersions(options); +module.exports = getBaselineVersions(); const compareVersions = require("./scripts/compare-versions-warning"); compareVersions(); diff --git a/scripts/get-baseline-versions.js b/scripts/get-baseline-versions.js index d905e11..a031c67 100644 --- a/scripts/get-baseline-versions.js +++ b/scripts/get-baseline-versions.js @@ -9,7 +9,7 @@ function readConfig(loc, name) { try { const pkg = require(path.join(loc, "package.json")); if (pkg.hasOwnProperty(name)) return pkg[name]; - } catch {} + } catch { } } while (loc !== (loc = path.dirname(loc))); return null; @@ -43,52 +43,68 @@ function reconcileConfigs(extendsConfig) { const pkgConfig = readConfig(process.cwd(), "browserslist-config-baseline") ?? {}; + // Handle correct configurations + if (pkgConfig.widelyAvailableOnDate && !extendsConfig.baselineYear) + bbmConfig.widelyAvailableOnDate = pkgConfig.widelyAvailableOnDate; + + if (pkgConfig.baselineYear && !extendsConfig.baselineYear) + bbmConfig.targetYear = pkgConfig.baselineYear; + + if (extendsConfig.baselineYear && !pkgConfig.baselineYear) + bbmConfig.targetYear = extendsConfig.baselineYear; + + if ( + (extendsConfig.includeDownstreamBrowsers && + !pkgConfig.includeDownstreamBrowsers) || + (!extendsConfig.includeDownstreamBrowsers && + pkgConfig.includeDownstreamBrowsers) || + (extendsConfig.includeDownstreamBrowsers && + pkgConfig.includeDownstreamBrowsers) + ) + bbmConfig.includeDownstreamBrowsers = true; + // Check to see if there are two configured target years - if (pkgConfig.targetYear && extendsConfig.targetYear) { + if (pkgConfig.baselineYear && extendsConfig.baselineYear) { bbmConfig.targetYear = Math.min( - pkgConfig.targetYear, - extendsConfig.targetYear, + pkgConfig.baselineYear, + extendsConfig.baselineYear, ); console.warn( - `[browserslist-config-baseline] You’ve set targetYear: ` + - `${pkgConfig.targetYear} in your package.json, but extended this ` + - `config as \`browserslist-config-baseline/${extendsConfig.targetYear}\`. ` + - `Proceeding with the lower option, targetYear: ${bbmConfig.targetYear}. ` + - `Remove targetYear in package.json or use \`extend browserslist-config-baseline\` ` + - `to suppress this warning.`, + `[browserslist-config-baseline] You’ve set baselineYear: ` + + `${pkgConfig.baselineYear} in your package.json, but extended this ` + + `config as \`browserslist-config-baseline/${extendsConfig.baselineYear}\`.\n` + + `Proceeding with the lower option, baselineYear: ${bbmConfig.targetYear}.\n` + + `Remove baselineYear in package.json or use \`extend browserslist-config-baseline\` ` + + `to suppress this warning.`, ); } // Check to see if widelyAvailableOnDate is being used alongside extends .../YYYY - if (pkgConfig.widelyAvailableOnDate && extendsConfig.targetYear) { + if (pkgConfig.widelyAvailableOnDate && extendsConfig.baselineYear) { const widelyAvailableOnDate = new Date(pkgConfig.widelyAvailableOnDate); - const targetYearDate = new Date(extendsConfig.targetYear + "-12-31"); + const baselineYearDate = new Date(extendsConfig.baselineYear + "-12-31"); let stringFragment = ""; - if (widelyAvailableOnDate < targetYearDate) { + if (widelyAvailableOnDate < baselineYearDate) { bbmConfig.widelyAvailableOnDate = pkgConfig.widelyAvailableOnDate; stringFragment += `Proceeding with the lower option, widelyAvailableOnDate: ${pkgConfig.widelyAvailableOnDate}.\n`; } else { - bbmConfig.targetYear = extendsConfig.targetYear; - stringFragment += `Proceeding with the lower option, targetYear: ${extendsConfig.targetYear}.\n`; + bbmConfig.targetYear = extendsConfig.baselineYear; + stringFragment += `Proceeding with the lower option, baselineYear: ${extendsConfig.baselineYear}.\n`; } console.warn( `[browserslist-config-baseline] You’ve set widelyAvailableOnDate: ` + - `"${pkgConfig.widelyAvailableOnDate}" in your package.json, but extended this ` + - `config as \`browserslist-config-baseline/${extendsConfig.targetYear}\`.\n` + - stringFragment + - `Remove widelyAvailableOnDate in package.json or use \`extend browserslist-config-baseline\` ` + - `to suppress this warning.`, + `"${pkgConfig.widelyAvailableOnDate}" in your package.json, but extended this ` + + `config as \`browserslist-config-baseline/${extendsConfig.baselineYear}\`.\n` + + stringFragment + + `Remove widelyAvailableOnDate in package.json or use \`extend browserslist-config-baseline\` ` + + `to suppress this warning.`, ); } - if (pkgConfig.widelyAvailableOnDate && !extendsConfig.targetYear) { - bbmConfig.widelyAvailableOnDate = pkgConfig.widelyAvailableOnDate; - } - // Check to see if extends and package have conflicting includeDownstreamBrowsers if ( extendsConfig.includeDownstreamBrowsers && @@ -97,11 +113,11 @@ function reconcileConfigs(extendsConfig) { bbmConfig.includeDownstreamBrowsers = false; console.warn( `[browserslist-config-baseline]` + - `You've extended your browserslist config using \`/with-downstream\` ` + - `but set includeDownstreamBrowsers: false in package.json.\n` + - `Proceeding with includeDownstreamBrowsers: false.\n` + - `Remove includeDownstreamBrowsers: false in package.json or use` + - `\`extend browserslist-config-baseline\` to suppress this warning.`, + `You've extended your browserslist config using \`/with-downstream\` ` + + `but set includeDownstreamBrowsers: false in package.json.\n` + + `Proceeding with includeDownstreamBrowsers: false.\n` + + `Remove includeDownstreamBrowsers: false in package.json or use` + + `\`extend browserslist-config-baseline\` to suppress this warning.`, ); } @@ -119,7 +135,7 @@ module.exports = function (extendsConfig = {}) { if (config.logConfigToConsole) { console.log( - "Your browserslit config from browserslist-config-baseline is:\n", + "Your browserslist config from browserslist-config-baseline is:\n", listToReturn, ); } diff --git a/with-downstream/2016.js b/with-downstream/2016.js index fa8b405..d281589 100644 --- a/with-downstream/2016.js +++ b/with-downstream/2016.js @@ -1,5 +1,5 @@ const getBaselineVersions = require("../scripts/get-baseline-versions"); module.exports = getBaselineVersions({ - targetYear: 2016, + baselineYear: 2016, includeDownstreamBrowsers: true, }); diff --git a/with-downstream/2017.js b/with-downstream/2017.js index a233128..081ba5b 100644 --- a/with-downstream/2017.js +++ b/with-downstream/2017.js @@ -1,5 +1,5 @@ const getBaselineVersions = require("../scripts/get-baseline-versions"); module.exports = getBaselineVersions({ - targetYear: 2017, + baselineYear: 2017, includeDownstreamBrowsers: true, }); diff --git a/with-downstream/2018.js b/with-downstream/2018.js index 55848be..7bc5a2b 100644 --- a/with-downstream/2018.js +++ b/with-downstream/2018.js @@ -1,5 +1,5 @@ const getBaselineVersions = require("../scripts/get-baseline-versions"); module.exports = getBaselineVersions({ - targetYear: 2018, + baselineYear: 2018, includeDownstreamBrowsers: true, }); diff --git a/with-downstream/2019.js b/with-downstream/2019.js index fb70e2a..b360d03 100644 --- a/with-downstream/2019.js +++ b/with-downstream/2019.js @@ -1,5 +1,5 @@ const getBaselineVersions = require("../scripts/get-baseline-versions"); module.exports = getBaselineVersions({ - targetYear: 2019, + baselineYear: 2019, includeDownstreamBrowsers: true, }); diff --git a/with-downstream/2020.js b/with-downstream/2020.js index 32d5389..1897fd8 100644 --- a/with-downstream/2020.js +++ b/with-downstream/2020.js @@ -1,5 +1,5 @@ const getBaselineVersions = require("../scripts/get-baseline-versions"); module.exports = getBaselineVersions({ - targetYear: 2020, + baselineYear: 2020, includeDownstreamBrowsers: true, }); diff --git a/with-downstream/2021.js b/with-downstream/2021.js index 14daab8..093342e 100644 --- a/with-downstream/2021.js +++ b/with-downstream/2021.js @@ -1,5 +1,5 @@ const getBaselineVersions = require("../scripts/get-baseline-versions"); module.exports = getBaselineVersions({ - targetYear: 2021, + baselineYear: 2021, includeDownstreamBrowsers: true, }); diff --git a/with-downstream/2022.js b/with-downstream/2022.js index d7539f3..0fab452 100644 --- a/with-downstream/2022.js +++ b/with-downstream/2022.js @@ -1,5 +1,5 @@ const getBaselineVersions = require("../scripts/get-baseline-versions"); module.exports = getBaselineVersions({ - targetYear: 2022, + baselineYear: 2022, includeDownstreamBrowsers: true, }); diff --git a/with-downstream/2023.js b/with-downstream/2023.js index e006301..8159d4f 100644 --- a/with-downstream/2023.js +++ b/with-downstream/2023.js @@ -1,5 +1,5 @@ const getBaselineVersions = require("../scripts/get-baseline-versions"); module.exports = getBaselineVersions({ - targetYear: 2023, + baselineYear: 2023, includeDownstreamBrowsers: true, }); diff --git a/with-downstream/2024.js b/with-downstream/2024.js index b6057fa..deb1f40 100644 --- a/with-downstream/2024.js +++ b/with-downstream/2024.js @@ -1,5 +1,5 @@ const getBaselineVersions = require("../scripts/get-baseline-versions"); module.exports = getBaselineVersions({ - targetYear: 2024, + baselineYear: 2024, includeDownstreamBrowsers: true, }); From a31c043ad36acc58cae973f7afe6caa3bf9c8e33 Mon Sep 17 00:00:00 2001 From: Tony Conway Date: Tue, 8 Apr 2025 15:14:35 +0100 Subject: [PATCH 8/8] Add logConfigToConsole to README --- README.md | 14 ++++++++++++++ 1 file changed, 14 insertions(+) diff --git a/README.md b/README.md index c717631..7105a4d 100644 --- a/README.md +++ b/README.md @@ -204,6 +204,20 @@ To include browsers the implement Chromium, set the `includeDownstreamBrowsers` } ``` +## Logging your config to the console + +To see the array of minimum browser versions that you are passing to `browserslist`, add `logConfigToConsole: true` to your `package.json` config: + +```json +{ + "browserslist-config-baseline": { + "logConfigToConsole": true + } +} +``` + +This works with both methods of setting your target browsers. + ## See also - [WebDX Baseline specification](https://github.com/web-platform-dx/web-features/blob/main/docs/baseline.md)