mirror of
https://github.com/vitejs/vite.git
synced 2024-11-21 14:48:41 +00:00
test: add sugarss sourcemap test (#10303)
This commit is contained in:
parent
a60529fd80
commit
7a6d4bc0d7
@ -231,210 +231,18 @@ describe.runIf(isServe)('serve', () => {
|
||||
`)
|
||||
})
|
||||
|
||||
test('should not output missing source file warning', () => {
|
||||
serverLogs.forEach((log) => {
|
||||
expect(log).not.toMatch(/Sourcemap for .+ points to missing source files/)
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
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()
|
||||
test('imported sugarss', async () => {
|
||||
const css = await getStyleTagContentIncluding('.imported-sugarss ')
|
||||
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;",
|
||||
"mappings": "AAAA;EACE;AADc",
|
||||
"sources": [
|
||||
"/root/linked.css",
|
||||
"/root/imported.sss",
|
||||
],
|
||||
"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
|
||||
".imported-sugarss
|
||||
color: red
|
||||
",
|
||||
],
|
||||
"version": 3,
|
||||
@ -448,9 +256,3 @@ describe.runIf(isServe)('serve', () => {
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
test.runIf(isBuild)('should not output sourcemap warning (#4939)', () => {
|
||||
serverLogs.forEach((log) => {
|
||||
expect(log).not.toMatch('Sourcemap is likely to be incorrect')
|
||||
})
|
||||
})
|
||||
|
2
playground/css-sourcemap/imported.sss
Normal file
2
playground/css-sourcemap/imported.sss
Normal file
@ -0,0 +1,2 @@
|
||||
.imported-sugarss
|
||||
color: red
|
@ -24,6 +24,8 @@
|
||||
<p class="imported-less"><imported less> with string additionalData</p>
|
||||
|
||||
<p class="imported-stylus"><imported stylus></p>
|
||||
|
||||
<p class="imported-sugarss"><imported sugarss></p>
|
||||
</div>
|
||||
|
||||
<script type="module">
|
||||
@ -40,6 +42,8 @@
|
||||
import './imported.less'
|
||||
|
||||
import './imported.styl'
|
||||
|
||||
import './imported.sss'
|
||||
</script>
|
||||
|
||||
<iframe src="virtual.html"></iframe>
|
||||
|
@ -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"
|
||||
}
|
||||
}
|
||||
|
@ -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: {}
|
||||
|
Loading…
Reference in New Issue
Block a user