From ad398247dbf9d99cc3ce079660fef602232d4547 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Hu=C3=A1ng=20J=C3=B9nli=C3=A0ng?= Date: Wed, 15 Mar 2023 16:02:48 -0400 Subject: [PATCH 1/7] resolve chalk from @babel/highlight's workspace --- packages/babel-code-frame/package.json | 2 - packages/babel-code-frame/test/index.js | 217 +++++++++++++----------- yarn.lock | 2 - 3 files changed, 120 insertions(+), 101 deletions(-) diff --git a/packages/babel-code-frame/package.json b/packages/babel-code-frame/package.json index 5cddfaf357f1..a47f4e1fa8fc 100644 --- a/packages/babel-code-frame/package.json +++ b/packages/babel-code-frame/package.json @@ -19,8 +19,6 @@ "@babel/highlight": "workspace:^" }, "devDependencies": { - "@types/chalk": "^2.0.0", - "chalk": "^2.0.0", "strip-ansi": "^4.0.0" }, "engines": { diff --git a/packages/babel-code-frame/test/index.js b/packages/babel-code-frame/test/index.js index 59f58c481060..95d22dd5f502 100644 --- a/packages/babel-code-frame/test/index.js +++ b/packages/babel-code-frame/test/index.js @@ -1,10 +1,29 @@ -import chalk from "chalk"; import stripAnsi from "strip-ansi"; - +import { createRequire } from "module"; import _codeFrame, { codeFrameColumns } from "../lib/index.js"; const codeFrame = _codeFrame.default || _codeFrame; +const require = createRequire(import.meta.url); +const babelHighlightPath = require.resolve("@babel/highlight"); +const chalkPath = require.resolve("chalk", { paths: [babelHighlightPath] }); +const chalk = require(chalkPath); + describe("@babel/code-frame", function () { + function stubColorSupport(supported) { + let originalChalkLevel; + let originalChalkSupportsColor; + beforeEach(function () { + originalChalkSupportsColor = chalk.supportsColor; + originalChalkLevel = chalk.level; + chalk.supportsColor = supported; + chalk.level = supported ? 1 : 0; + }); + + afterEach(function () { + chalk.supportsColor = originalChalkSupportsColor; + chalk.level = originalChalkLevel; + }); + } test("basic usage", function () { const rawLines = ["class Foo {", " constructor()", "};"].join("\n"); expect(codeFrame(rawLines, 2, 16)).toEqual( @@ -94,53 +113,109 @@ describe("@babel/code-frame", function () { ); }); - test("opts.highlightCode", function () { - const rawLines = "console.log('babel')"; - const result = codeFrame(rawLines, 1, 9, { highlightCode: true }); - const stripped = stripAnsi(result); - expect(result.length).toBeGreaterThan(stripped.length); - expect(stripped).toEqual( - ["> 1 | console.log('babel')", " | ^"].join("\n"), - ); - }); + describe("when colors are supported", () => { + stubColorSupport(true); - test("opts.highlightCode with multiple columns and lines", function () { - // prettier-ignore - const rawLines = [ - "function a(b, c) {", - " return b + c;", - "}" - ].join("\n"); + test("opts.highlightCode", function () { + const rawLines = "console.log('babel')"; + const result = codeFrame(rawLines, 1, 9, { highlightCode: true }); + const stripped = stripAnsi(result); + expect(result.length).toBeGreaterThan(stripped.length); + expect(stripped).toEqual( + ["> 1 | console.log('babel')", " | ^"].join("\n"), + ); + }); - const result = codeFrameColumns( - rawLines, - { - start: { - line: 1, - column: 1, + test("opts.highlightCode with multiple columns and lines", function () { + // prettier-ignore + const rawLines = [ + "function a(b, c) {", + " return b + c;", + "}" + ].join("\n"); + + const result = codeFrameColumns( + rawLines, + { + start: { + line: 1, + column: 1, + }, + end: { + line: 3, + column: 1, + }, }, - end: { - line: 3, - column: 1, + { + highlightCode: true, + message: "Message about things", }, - }, - { - highlightCode: true, - message: "Message about things", - }, - ); - const stripped = stripAnsi(result); - expect(stripped).toEqual( - // prettier-ignore - [ - "> 1 | function a(b, c) {", - " | ^^^^^^^^^^^^^^^^^^", - "> 2 | return b + c;", - " | ^^^^^^^^^^^^^^^", - "> 3 | }", - " | ^ Message about things", - ].join('\n'), - ); + ); + const stripped = stripAnsi(result); + expect(result.length).toBeGreaterThan(stripped.length); + expect(stripped).toEqual( + // prettier-ignore + [ + "> 1 | function a(b, c) {", + " | ^^^^^^^^^^^^^^^^^^", + "> 2 | return b + c;", + " | ^^^^^^^^^^^^^^^", + "> 3 | }", + " | ^ Message about things", + ].join('\n'), + ); + }); + test("opts.forceColor", function () { + const marker = chalk.red.bold; + const gutter = chalk.grey; + + const rawLines = ["", "", "", ""].join("\n"); + expect( + codeFrame(rawLines, 3, null, { + linesAbove: 1, + linesBelow: 1, + forceColor: true, + }), + ).toEqual( + chalk.reset( + [ + " " + gutter(" 2 |"), + marker(">") + gutter(" 3 |"), + " " + gutter(" 4 |"), + ].join("\n"), + ), + ); + }); + + test("jsx", function () { + const gutter = chalk.grey; + const yellow = chalk.yellow; + + const rawLines = ["
"].join("\n"); + + expect( + JSON.stringify( + codeFrame(rawLines, 0, null, { + linesAbove: 1, + linesBelow: 1, + forceColor: true, + }), + ), + ).toEqual( + JSON.stringify( + chalk.reset( + " " + + gutter(" 1 |") + + " " + + yellow("<") + + yellow("div") + + " " + + yellow("/") + + yellow(">"), + ), + ), + ); + }); }); test("opts.linesAbove", function () { @@ -263,58 +338,6 @@ describe("@babel/code-frame", function () { ).toEqual(["> 2 | constructor() {"].join("\n")); }); - test("opts.forceColor", function () { - const marker = chalk.red.bold; - const gutter = chalk.grey; - - const rawLines = ["", "", "", ""].join("\n"); - expect( - codeFrame(rawLines, 3, null, { - linesAbove: 1, - linesBelow: 1, - forceColor: true, - }), - ).toEqual( - chalk.reset( - [ - " " + gutter(" 2 |"), - marker(">") + gutter(" 3 |"), - " " + gutter(" 4 |"), - ].join("\n"), - ), - ); - }); - - test("jsx", function () { - const gutter = chalk.grey; - const yellow = chalk.yellow; - - const rawLines = ["
"].join("\n"); - - expect( - JSON.stringify( - codeFrame(rawLines, 0, null, { - linesAbove: 1, - linesBelow: 1, - forceColor: true, - }), - ), - ).toEqual( - JSON.stringify( - chalk.reset( - " " + - gutter(" 1 |") + - " " + - yellow("<") + - yellow("div") + - " " + - yellow("/") + - yellow(">"), - ), - ), - ); - }); - test("basic usage, new API", function () { const rawLines = ["class Foo {", " constructor()", "};"].join("\n"); expect( diff --git a/yarn.lock b/yarn.lock index 378d3686807e..6efbd8e4af2c 100644 --- a/yarn.lock +++ b/yarn.lock @@ -269,8 +269,6 @@ __metadata: resolution: "@babel/code-frame@workspace:packages/babel-code-frame" dependencies: "@babel/highlight": "workspace:^" - "@types/chalk": ^2.0.0 - chalk: ^2.0.0 strip-ansi: ^4.0.0 languageName: unknown linkType: soft From eb1d1062ad49a98598685f3f399e31c0b7e9e05c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Hu=C3=A1ng=20J=C3=B9nli=C3=A0ng?= Date: Wed, 15 Mar 2023 16:03:11 -0400 Subject: [PATCH 2/7] improve color supports stub to work with Chalk 4 --- packages/babel-highlight/test/index.js | 10 +++++++--- 1 file changed, 7 insertions(+), 3 deletions(-) diff --git a/packages/babel-highlight/test/index.js b/packages/babel-highlight/test/index.js index ebe8662565c7..168c80f3c054 100644 --- a/packages/babel-highlight/test/index.js +++ b/packages/babel-highlight/test/index.js @@ -6,14 +6,18 @@ const highlight = _highlight.default || _highlight; describe("@babel/highlight", function () { function stubColorSupport(supported) { - let originalSupportsColor; + let originalChalkLevel; + let originalChalkSupportsColor; beforeEach(function () { - originalSupportsColor = chalk.supportsColor; + originalChalkSupportsColor = chalk.supportsColor; + originalChalkLevel = chalk.level; chalk.supportsColor = supported; + chalk.level = supported ? 1 : 0; }); afterEach(function () { - chalk.supportsColor = originalSupportsColor; + chalk.supportsColor = originalChalkSupportsColor; + chalk.level = originalChalkLevel; }); } From 077af828c660d8ac6e6aab3e1e884f790a8ec148 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Hu=C3=A1ng=20J=C3=B9nli=C3=A0ng?= Date: Wed, 15 Mar 2023 16:03:51 -0400 Subject: [PATCH 3/7] remove --color from test jobs --- .github/workflows/ci.yml | 17 ++++------------- .github/workflows/update-windows-fixtures.yml | 4 +--- scripts/integration-tests/e2e-jest.sh | 6 +++--- 3 files changed, 8 insertions(+), 19 deletions(-) diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml index 2410775e6b25..4830866bd20f 100644 --- a/.github/workflows/ci.yml +++ b/.github/workflows/ci.yml @@ -90,9 +90,7 @@ jobs: env: USE_ESM: true - name: Test - # Hack: --color has supports-color@5 returned true for GitHub CI - # Remove once `chalk` is bumped to 4.0. - run: yarn jest --ci --color + run: yarn jest --ci env: BABEL_ENV: test USE_ESM: true @@ -231,12 +229,9 @@ jobs: with: node-version: ${{ matrix.node-version }} - name: Test on node.js ${{ matrix.node-version }} - # Hack: --color has supports-color@5 returned true for GitHub CI - # Remove once `chalk` is bumped to 4.0. - # Todo(Babel 8): Jest execution path is hardcoded because Yarn 2 does not support node 6 run: | - BABEL_ENV=test node --max-old-space-size=4096 ./node_modules/.bin/jest --ci --color + BABEL_ENV=test node --max-old-space-size=4096 ./node_modules/.bin/jest --ci env: TEST_FUZZ: "${{ (matrix.node-version == '6' || matrix.node-version == '8' || matrix.node-version == '10') && 'false' || 'true' }}" - name: Use Node.js latest # For `yarn version` in post actions of the first actions/setup-node @@ -307,10 +302,8 @@ jobs: - name: Generate runtime helpers run: make build-plugin-transform-runtime-dist - name: Test - # Hack: --color has supports-color@5 returned true for GitHub CI - # Remove once `chalk` is bumped to 4.0. run: | - yarn jest --ci --color + yarn jest --ci yarn test:esm env: BABEL_ENV: test @@ -338,9 +331,7 @@ jobs: - name: Extract artifacts run: tar -xf babel-artifact.tar; rm babel-artifact.tar - name: Test on Windows - # Hack: --color has supports-color@5 returned true for GitHub CI - # Remove once `chalk` is bumped to 4.0. - run: yarn jest --ci --color + run: yarn jest --ci env: BABEL_ENV: test diff --git a/.github/workflows/update-windows-fixtures.yml b/.github/workflows/update-windows-fixtures.yml index 63bd6195915a..45ee17e32c79 100644 --- a/.github/workflows/update-windows-fixtures.yml +++ b/.github/workflows/update-windows-fixtures.yml @@ -60,10 +60,8 @@ jobs: git reset --hard HEAD - name: Regenerate fixtures - # Hack: --color has supports-color@5 returned true for GitHub CI - # Remove once `chalk` is bumped to 4.0. run: | - yarn jest -u --ci --color || true + yarn jest -u --ci || true env: BABEL_ENV: test OVERWRITE: true diff --git a/scripts/integration-tests/e2e-jest.sh b/scripts/integration-tests/e2e-jest.sh index bc36056f58ec..c788f59de201 100755 --- a/scripts/integration-tests/e2e-jest.sh +++ b/scripts/integration-tests/e2e-jest.sh @@ -72,8 +72,8 @@ rm -f packages/jest-transform/src/__tests__/__snapshots__/ScriptTransformer.test # The goals of this e2e test are: # 1) Check that the typescript compilation isn't completely broken # 2) Make sure that we don't accidentally break jest's usage of the Babel API -CI=true yarn jest --color --maxWorkers=2 --config jest.config.mjs packages -CI=true yarn jest --color --maxWorkers=2 --config jest.config.mjs e2e/__tests__/babel -CI=true yarn jest --color --maxWorkers=2 --config jest.config.mjs e2e/__tests__/transform +CI=true yarn jest --maxWorkers=2 --config jest.config.mjs packages +CI=true yarn jest --maxWorkers=2 --config jest.config.mjs e2e/__tests__/babel +CI=true yarn jest --maxWorkers=2 --config jest.config.mjs e2e/__tests__/transform cleanup From 52dd86212113d19bfd65fdaf5e4a2862665ab9b1 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Hu=C3=A1ng=20J=C3=B9nli=C3=A0ng?= Date: Wed, 15 Mar 2023 17:47:11 -0400 Subject: [PATCH 4/7] create a valid SupportsColor Level --- packages/babel-code-frame/test/index.js | 2 +- packages/babel-highlight/test/index.js | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/babel-code-frame/test/index.js b/packages/babel-code-frame/test/index.js index 95d22dd5f502..bb88ccc422fb 100644 --- a/packages/babel-code-frame/test/index.js +++ b/packages/babel-code-frame/test/index.js @@ -15,7 +15,7 @@ describe("@babel/code-frame", function () { beforeEach(function () { originalChalkSupportsColor = chalk.supportsColor; originalChalkLevel = chalk.level; - chalk.supportsColor = supported; + chalk.supportsColor = supported ? { level: 1 } : false; chalk.level = supported ? 1 : 0; }); diff --git a/packages/babel-highlight/test/index.js b/packages/babel-highlight/test/index.js index 168c80f3c054..1002b6e471f1 100644 --- a/packages/babel-highlight/test/index.js +++ b/packages/babel-highlight/test/index.js @@ -11,7 +11,7 @@ describe("@babel/highlight", function () { beforeEach(function () { originalChalkSupportsColor = chalk.supportsColor; originalChalkLevel = chalk.level; - chalk.supportsColor = supported; + chalk.supportsColor = supported ? { level: 1 } : false; chalk.level = supported ? 1 : 0; }); From a019ff57c12042d257c6b32342b76921c892c265 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Hu=C3=A1ng=20J=C3=B9nli=C3=A0ng?= Date: Wed, 15 Mar 2023 18:03:14 -0400 Subject: [PATCH 5/7] also stub chalk.enabled --- packages/babel-code-frame/test/index.js | 4 ++++ packages/babel-highlight/test/index.js | 4 ++++ 2 files changed, 8 insertions(+) diff --git a/packages/babel-code-frame/test/index.js b/packages/babel-code-frame/test/index.js index bb88ccc422fb..68fb07834b28 100644 --- a/packages/babel-code-frame/test/index.js +++ b/packages/babel-code-frame/test/index.js @@ -12,16 +12,20 @@ describe("@babel/code-frame", function () { function stubColorSupport(supported) { let originalChalkLevel; let originalChalkSupportsColor; + let originalChalkEnabled; beforeEach(function () { originalChalkSupportsColor = chalk.supportsColor; originalChalkLevel = chalk.level; + originalChalkEnabled = chalk.enabled; chalk.supportsColor = supported ? { level: 1 } : false; chalk.level = supported ? 1 : 0; + chalk.enabled = supported; }); afterEach(function () { chalk.supportsColor = originalChalkSupportsColor; chalk.level = originalChalkLevel; + chalk.enabled = originalChalkEnabled; }); } test("basic usage", function () { diff --git a/packages/babel-highlight/test/index.js b/packages/babel-highlight/test/index.js index 1002b6e471f1..caf0671bb8b0 100644 --- a/packages/babel-highlight/test/index.js +++ b/packages/babel-highlight/test/index.js @@ -8,16 +8,20 @@ describe("@babel/highlight", function () { function stubColorSupport(supported) { let originalChalkLevel; let originalChalkSupportsColor; + let originalChalkEnabled; beforeEach(function () { originalChalkSupportsColor = chalk.supportsColor; originalChalkLevel = chalk.level; + originalChalkEnabled = chalk.enabled; chalk.supportsColor = supported ? { level: 1 } : false; chalk.level = supported ? 1 : 0; + chalk.enabled = supported; }); afterEach(function () { chalk.supportsColor = originalChalkSupportsColor; chalk.level = originalChalkLevel; + chalk.enabled = originalChalkEnabled; }); } From 3f37e7739145be5fc8a5c027ec573b654d8c774b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Hu=C3=A1ng=20J=C3=B9nli=C3=A0ng?= Date: Wed, 15 Mar 2023 18:10:59 -0400 Subject: [PATCH 6/7] obtain chalk from getChalk --- packages/babel-code-frame/test/index.js | 7 ++----- packages/babel-highlight/test/index.js | 3 ++- 2 files changed, 4 insertions(+), 6 deletions(-) diff --git a/packages/babel-code-frame/test/index.js b/packages/babel-code-frame/test/index.js index 68fb07834b28..9f30c89f34ee 100644 --- a/packages/babel-code-frame/test/index.js +++ b/packages/babel-code-frame/test/index.js @@ -1,12 +1,9 @@ import stripAnsi from "strip-ansi"; -import { createRequire } from "module"; +import { getChalk } from "@babel/highlight"; import _codeFrame, { codeFrameColumns } from "../lib/index.js"; const codeFrame = _codeFrame.default || _codeFrame; -const require = createRequire(import.meta.url); -const babelHighlightPath = require.resolve("@babel/highlight"); -const chalkPath = require.resolve("chalk", { paths: [babelHighlightPath] }); -const chalk = require(chalkPath); +const chalk = getChalk({}); describe("@babel/code-frame", function () { function stubColorSupport(supported) { diff --git a/packages/babel-highlight/test/index.js b/packages/babel-highlight/test/index.js index caf0671bb8b0..e0dadbce143b 100644 --- a/packages/babel-highlight/test/index.js +++ b/packages/babel-highlight/test/index.js @@ -1,9 +1,10 @@ -import chalk from "chalk"; import stripAnsi from "strip-ansi"; import _highlight, { shouldHighlight, getChalk } from "../lib/index.js"; const highlight = _highlight.default || _highlight; +const chalk = getChalk({}); + describe("@babel/highlight", function () { function stubColorSupport(supported) { let originalChalkLevel; From 16ed156dd9901c83d08988cb3f934b0474deccd9 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Hu=C3=A1ng=20J=C3=B9nli=C3=A0ng?= Date: Wed, 15 Mar 2023 18:31:55 -0400 Subject: [PATCH 7/7] jest e2e test requires --color --- scripts/integration-tests/e2e-jest.sh | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/scripts/integration-tests/e2e-jest.sh b/scripts/integration-tests/e2e-jest.sh index c788f59de201..bc36056f58ec 100755 --- a/scripts/integration-tests/e2e-jest.sh +++ b/scripts/integration-tests/e2e-jest.sh @@ -72,8 +72,8 @@ rm -f packages/jest-transform/src/__tests__/__snapshots__/ScriptTransformer.test # The goals of this e2e test are: # 1) Check that the typescript compilation isn't completely broken # 2) Make sure that we don't accidentally break jest's usage of the Babel API -CI=true yarn jest --maxWorkers=2 --config jest.config.mjs packages -CI=true yarn jest --maxWorkers=2 --config jest.config.mjs e2e/__tests__/babel -CI=true yarn jest --maxWorkers=2 --config jest.config.mjs e2e/__tests__/transform +CI=true yarn jest --color --maxWorkers=2 --config jest.config.mjs packages +CI=true yarn jest --color --maxWorkers=2 --config jest.config.mjs e2e/__tests__/babel +CI=true yarn jest --color --maxWorkers=2 --config jest.config.mjs e2e/__tests__/transform cleanup