From 1ddc24d0aa61f3926fa5010394931207fb566b13 Mon Sep 17 00:00:00 2001 From: sapphi-red Date: Sat, 1 Oct 2022 17:13:17 +0900 Subject: [PATCH 1/2] test: remove duplicate css sourcemap test --- .../__tests__/css-sourcemap.spec.ts | 217 ------------------ 1 file changed, 217 deletions(-) diff --git a/playground/css-sourcemap/__tests__/css-sourcemap.spec.ts b/playground/css-sourcemap/__tests__/css-sourcemap.spec.ts index d7e9a5e8ecd71d..f97b34866609eb 100644 --- a/playground/css-sourcemap/__tests__/css-sourcemap.spec.ts +++ b/playground/css-sourcemap/__tests__/css-sourcemap.spec.ts @@ -237,220 +237,3 @@ describe.runIf(isServe)('serve', () => { }) }) }) - -describe.runIf(isServe)('serve', () => { - const getStyleTagContentIncluding = async (content: string) => { - const styles = await page.$$('style') - for (const style of styles) { - const text = await style.textContent() - if (text.includes(content)) { - return text - } - } - throw new Error('Not found') - } - - test('linked css', async () => { - const res = await page.request.get( - new URL('./linked.css', page.url()).href, - { - headers: { - accept: 'text/css' - } - } - ) - const css = await res.text() - const map = extractSourcemap(css) - expect(formatSourcemapForSnapshot(map)).toMatchInlineSnapshot(` - { - "mappings": "AAAA,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;AACT,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;AACb,CAAC;", - "sources": [ - "/root/linked.css", - ], - "sourcesContent": [ - ".linked { - color: red; - } - ", - ], - "version": 3, - } - `) - }) - - test('linked css with import', async () => { - const res = await page.request.get( - new URL('./linked-with-import.css', page.url()).href, - { - headers: { - accept: 'text/css' - } - } - ) - const css = await res.text() - const map = extractSourcemap(css) - expect(formatSourcemapForSnapshot(map)).toMatchInlineSnapshot(` - { - "mappings": "AAAA;EACE,UAAU;AACZ;;ACAA;EACE,UAAU;AACZ", - "sources": [ - "/root/be-imported.css", - "/root/linked-with-import.css", - ], - "sourcesContent": [ - ".be-imported { - color: red; - } - ", - "@import '@/be-imported.css'; - - .linked-with-import { - color: red; - } - ", - ], - "version": 3, - } - `) - }) - - test('imported css', async () => { - const css = await getStyleTagContentIncluding('.imported ') - const map = extractSourcemap(css) - expect(formatSourcemapForSnapshot(map)).toMatchInlineSnapshot(` - { - "mappings": "AAAA,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;AACX,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;AACb,CAAC;", - "sources": [ - "/root/imported.css", - ], - "sourcesContent": [ - ".imported { - color: red; - } - ", - ], - "version": 3, - } - `) - }) - - test('imported css with import', async () => { - const css = await getStyleTagContentIncluding('.imported-with-import ') - const map = extractSourcemap(css) - expect(formatSourcemapForSnapshot(map)).toMatchInlineSnapshot(` - { - "mappings": "AAAA;EACE,UAAU;AACZ;;ACAA;EACE,UAAU;AACZ", - "sources": [ - "/root/be-imported.css", - "/root/imported-with-import.css", - ], - "sourcesContent": [ - ".be-imported { - color: red; - } - ", - "@import '@/be-imported.css'; - - .imported-with-import { - color: red; - } - ", - ], - "version": 3, - } - `) - }) - - test('imported sass', async () => { - const css = await getStyleTagContentIncluding('.imported-sass ') - const map = extractSourcemap(css) - expect(formatSourcemapForSnapshot(map)).toMatchInlineSnapshot(` - { - "mappings": "AACE;EACE", - "sources": [ - "/root/imported.sass", - ], - "sourcesContent": [ - ".imported - &-sass - color: red - ", - ], - "version": 3, - } - `) - }) - - test('imported sass module', async () => { - const css = await getStyleTagContentIncluding('._imported-sass-module_') - const map = extractSourcemap(css) - expect(formatSourcemapForSnapshot(map)).toMatchInlineSnapshot(` - { - "mappings": "AACE;EACE", - "sources": [ - "/root/imported.module.sass", - ], - "sourcesContent": [ - ".imported - &-sass-module - color: red - ", - ], - "version": 3, - } - `) - }) - - test('imported less', async () => { - const css = await getStyleTagContentIncluding('.imported-less ') - const map = extractSourcemap(css) - expect(formatSourcemapForSnapshot(map)).toMatchInlineSnapshot(` - { - "mappings": "AACE;EACE", - "sources": [ - "/root/imported.less", - ], - "sourcesContent": [ - ".imported { - &-less { - color: @color; - } - } - ", - ], - "version": 3, - } - `) - }) - - test('imported stylus', async () => { - const css = await getStyleTagContentIncluding('.imported-stylus ') - const map = extractSourcemap(css) - expect(formatSourcemapForSnapshot(map)).toMatchInlineSnapshot(` - { - "mappings": "AACE;EACE,cAAM", - "sources": [ - "/root/imported.styl", - ], - "sourcesContent": [ - ".imported - &-stylus - color blue-red-mixed - ", - ], - "version": 3, - } - `) - }) - - test('should not output missing source file warning', () => { - serverLogs.forEach((log) => { - expect(log).not.toMatch(/Sourcemap for .+ points to missing source files/) - }) - }) -}) - -test.runIf(isBuild)('should not output sourcemap warning (#4939)', () => { - serverLogs.forEach((log) => { - expect(log).not.toMatch('Sourcemap is likely to be incorrect') - }) -}) From b9953dafcb6c1c1d9290ec46e0164b9147dadcd0 Mon Sep 17 00:00:00 2001 From: sapphi-red Date: Sat, 1 Oct 2022 17:16:10 +0900 Subject: [PATCH 2/2] test: add sugarss sourcemap test --- .../__tests__/css-sourcemap.spec.ts | 19 +++++++++++++++++++ playground/css-sourcemap/imported.sss | 2 ++ playground/css-sourcemap/index.html | 4 ++++ playground/css-sourcemap/package.json | 3 ++- pnpm-lock.yaml | 2 ++ 5 files changed, 29 insertions(+), 1 deletion(-) create mode 100644 playground/css-sourcemap/imported.sss diff --git a/playground/css-sourcemap/__tests__/css-sourcemap.spec.ts b/playground/css-sourcemap/__tests__/css-sourcemap.spec.ts index f97b34866609eb..4b2331e8836d4c 100644 --- a/playground/css-sourcemap/__tests__/css-sourcemap.spec.ts +++ b/playground/css-sourcemap/__tests__/css-sourcemap.spec.ts @@ -231,6 +231,25 @@ describe.runIf(isServe)('serve', () => { `) }) + test('imported sugarss', async () => { + const css = await getStyleTagContentIncluding('.imported-sugarss ') + const map = extractSourcemap(css) + expect(formatSourcemapForSnapshot(map)).toMatchInlineSnapshot(` + { + "mappings": "AAAA;EACE;AADc", + "sources": [ + "/root/imported.sss", + ], + "sourcesContent": [ + ".imported-sugarss + color: red + ", + ], + "version": 3, + } + `) + }) + test('should not output missing source file warning', () => { serverLogs.forEach((log) => { expect(log).not.toMatch(/Sourcemap for .+ points to missing source files/) diff --git a/playground/css-sourcemap/imported.sss b/playground/css-sourcemap/imported.sss new file mode 100644 index 00000000000000..56084992472c47 --- /dev/null +++ b/playground/css-sourcemap/imported.sss @@ -0,0 +1,2 @@ +.imported-sugarss + color: red diff --git a/playground/css-sourcemap/index.html b/playground/css-sourcemap/index.html index a943c1d113a9b4..6f81e0322e47be 100644 --- a/playground/css-sourcemap/index.html +++ b/playground/css-sourcemap/index.html @@ -24,6 +24,8 @@

CSS Sourcemap

<imported less> with string additionalData

<imported stylus>

+ +

<imported sugarss>

diff --git a/playground/css-sourcemap/package.json b/playground/css-sourcemap/package.json index d61c74d04eab04..3c60c0f1aa40e4 100644 --- a/playground/css-sourcemap/package.json +++ b/playground/css-sourcemap/package.json @@ -12,6 +12,7 @@ "less": "^4.1.3", "magic-string": "^0.26.4", "sass": "^1.55.0", - "stylus": "^0.59.0" + "stylus": "^0.59.0", + "sugarss": "^4.0.1" } } diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 088899102f8c76..965ac298184bd6 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -420,11 +420,13 @@ importers: magic-string: ^0.26.4 sass: ^1.55.0 stylus: ^0.59.0 + sugarss: ^4.0.1 devDependencies: less: 4.1.3 magic-string: 0.26.4 sass: 1.55.0 stylus: 0.59.0 + sugarss: 4.0.1 playground/css/css-dep: specifiers: {}