Skip to content

fix(ssrTransform): preserve line offset when transforming imports #19004

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.

Sign up for GitHub

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

Merged
sapphi-red merged 9 commits into from
Dec 24, 2024
Merged

fix(ssrTransform): preserve line offset when transforming imports #19004

Changes from 1 commit
Commits
Show all changes
9 commits
Select commit Hold shift + click to select a range
5f10b65
fix(ssrTransform): preserve line offset when transforming imports
aleclarson Dec 18, 2024
b8c5ffe
update test snapshots
aleclarson Dec 18, 2024
37586e1
chore: format
aleclarson Dec 18, 2024
811683f
test: import hoisting and line offset preservation
aleclarson Dec 19, 2024
2281311
get the test to pass
aleclarson Dec 19, 2024
dbd8e54
one more test
aleclarson Dec 19, 2024
0317abd
tweak test name
aleclarson Dec 19, 2024
defd7f4
Update packages/vite/src/node/ssr/ssrTransform.ts
aleclarson Dec 20, 2024
684893d
Update packages/vite/src/node/ssr/__tests__/ssrTransform.spec.ts
aleclarson Dec 20, 2024
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
chore: format
  • Loading branch information
@aleclarson
aleclarson committed Dec 18, 2024
commit 37586e1144e1a3b4cf3b8aceb3059e8469a68e43
72 changes: 54 additions & 18 deletions packages/vite/src/node/ssr/__tests__/ssrTransform.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,31 +14,39 @@ const ssrTransformSimpleCode = async (code: string, url?: string) =>
test('default import', async () => {
expect(
await ssrTransformSimpleCode(`import foo from 'vue';console.log(foo.bar)`),
).toMatchInlineSnapshot(`"const __vite_ssr_import_0__ = await __vite_ssr_import__("vue", {"importedNames":["default"]});console.log(__vite_ssr_import_0__.default.bar)"`)
).toMatchInlineSnapshot(
`"const __vite_ssr_import_0__ = await __vite_ssr_import__("vue", {"importedNames":["default"]});console.log(__vite_ssr_import_0__.default.bar)"`,
)
})

test('named import', async () => {
expect(
await ssrTransformSimpleCode(
`import { ref } from 'vue';function foo() { return ref(0) }`,
),
).toMatchInlineSnapshot(`"const __vite_ssr_import_0__ = await __vite_ssr_import__("vue", {"importedNames":["ref"]});function foo() { return (0,__vite_ssr_import_0__.ref)(0) }"`)
).toMatchInlineSnapshot(
`"const __vite_ssr_import_0__ = await __vite_ssr_import__("vue", {"importedNames":["ref"]});function foo() { return (0,__vite_ssr_import_0__.ref)(0) }"`,
)
})

test('named import: arbitrary module namespace specifier', async () => {
expect(
await ssrTransformSimpleCode(
`import { "some thing" as ref } from 'vue';function foo() { return ref(0) }`,
),
).toMatchInlineSnapshot(`"const __vite_ssr_import_0__ = await __vite_ssr_import__("vue", {"importedNames":["some thing"]});function foo() { return (0,__vite_ssr_import_0__["some thing"])(0) }"`)
).toMatchInlineSnapshot(
`"const __vite_ssr_import_0__ = await __vite_ssr_import__("vue", {"importedNames":["some thing"]});function foo() { return (0,__vite_ssr_import_0__["some thing"])(0) }"`,
)
})

test('namespace import', async () => {
expect(
await ssrTransformSimpleCode(
`import * as vue from 'vue';function foo() { return vue.ref(0) }`,
),
).toMatchInlineSnapshot(`"const __vite_ssr_import_0__ = await __vite_ssr_import__("vue");function foo() { return __vite_ssr_import_0__.ref(0) }"`)
).toMatchInlineSnapshot(
`"const __vite_ssr_import_0__ = await __vite_ssr_import__("vue");function foo() { return __vite_ssr_import_0__.ref(0) }"`,
)
})

test('export function declaration', async () => {
Expand Down Expand Up @@ -171,7 +179,9 @@ test('hoist import to top', async () => {
await ssrTransformSimpleCode(
`path.resolve('server.js');import path from 'node:path';`,
),
).toMatchInlineSnapshot(`"const __vite_ssr_import_0__ = await __vite_ssr_import__("node:path", {"importedNames":["default"]});__vite_ssr_import_0__.default.resolve('server.js');"`)
).toMatchInlineSnapshot(
`"const __vite_ssr_import_0__ = await __vite_ssr_import__("node:path", {"importedNames":["default"]});__vite_ssr_import_0__.default.resolve('server.js');"`,
)
})

test('import.meta', async () => {
Expand All @@ -196,15 +206,19 @@ test('do not rewrite method definition', async () => {
const result = await ssrTransformSimple(
`import { fn } from 'vue';class A { fn() { fn() } }`,
)
expect(result?.code).toMatchInlineSnapshot(`"const __vite_ssr_import_0__ = await __vite_ssr_import__("vue", {"importedNames":["fn"]});class A { fn() { (0,__vite_ssr_import_0__.fn)() } }"`)
expect(result?.code).toMatchInlineSnapshot(
`"const __vite_ssr_import_0__ = await __vite_ssr_import__("vue", {"importedNames":["fn"]});class A { fn() { (0,__vite_ssr_import_0__.fn)() } }"`,
)
expect(result?.deps).toEqual(['vue'])
})

test('do not rewrite when variable is in scope', async () => {
const result = await ssrTransformSimple(
`import { fn } from 'vue';function A(){ const fn = () => {}; return { fn }; }`,
)
expect(result?.code).toMatchInlineSnapshot(`"const __vite_ssr_import_0__ = await __vite_ssr_import__("vue", {"importedNames":["fn"]});function A(){ const fn = () => {}; return { fn }; }"`)
expect(result?.code).toMatchInlineSnapshot(
`"const __vite_ssr_import_0__ = await __vite_ssr_import__("vue", {"importedNames":["fn"]});function A(){ const fn = () => {}; return { fn }; }"`,
)
expect(result?.deps).toEqual(['vue'])
})

Expand All @@ -213,7 +227,9 @@ test('do not rewrite when variable is in scope with object destructuring', async
const result = await ssrTransformSimple(
`import { fn } from 'vue';function A(){ let {fn, test} = {fn: 'foo', test: 'bar'}; return { fn }; }`,
)
expect(result?.code).toMatchInlineSnapshot(`"const __vite_ssr_import_0__ = await __vite_ssr_import__("vue", {"importedNames":["fn"]});function A(){ let {fn, test} = {fn: 'foo', test: 'bar'}; return { fn }; }"`)
expect(result?.code).toMatchInlineSnapshot(
`"const __vite_ssr_import_0__ = await __vite_ssr_import__("vue", {"importedNames":["fn"]});function A(){ let {fn, test} = {fn: 'foo', test: 'bar'}; return { fn }; }"`,
)
expect(result?.deps).toEqual(['vue'])
})

Expand All @@ -222,7 +238,9 @@ test('do not rewrite when variable is in scope with array destructuring', async
const result = await ssrTransformSimple(
`import { fn } from 'vue';function A(){ let [fn, test] = ['foo', 'bar']; return { fn }; }`,
)
expect(result?.code).toMatchInlineSnapshot(`"const __vite_ssr_import_0__ = await __vite_ssr_import__("vue", {"importedNames":["fn"]});function A(){ let [fn, test] = ['foo', 'bar']; return { fn }; }"`)
expect(result?.code).toMatchInlineSnapshot(
`"const __vite_ssr_import_0__ = await __vite_ssr_import__("vue", {"importedNames":["fn"]});function A(){ let [fn, test] = ['foo', 'bar']; return { fn }; }"`,
)
expect(result?.deps).toEqual(['vue'])
})

Expand All @@ -231,7 +249,9 @@ test('rewrite variable in string interpolation in function nested arguments', as
const result = await ssrTransformSimple(
`import { fn } from 'vue';function A({foo = \`test\${fn}\`} = {}){ return {}; }`,
)
expect(result?.code).toMatchInlineSnapshot(`"const __vite_ssr_import_0__ = await __vite_ssr_import__("vue", {"importedNames":["fn"]});function A({foo = \`test\${__vite_ssr_import_0__.fn}\`} = {}){ return {}; }"`)
expect(result?.code).toMatchInlineSnapshot(
`"const __vite_ssr_import_0__ = await __vite_ssr_import__("vue", {"importedNames":["fn"]});function A({foo = \`test\${__vite_ssr_import_0__.fn}\`} = {}){ return {}; }"`,
)
expect(result?.deps).toEqual(['vue'])
})

Expand All @@ -240,15 +260,19 @@ test('rewrite variables in default value of destructuring params', async () => {
const result = await ssrTransformSimple(
`import { fn } from 'vue';function A({foo = fn}){ return {}; }`,
)
expect(result?.code).toMatchInlineSnapshot(`"const __vite_ssr_import_0__ = await __vite_ssr_import__("vue", {"importedNames":["fn"]});function A({foo = __vite_ssr_import_0__.fn}){ return {}; }"`)
expect(result?.code).toMatchInlineSnapshot(
`"const __vite_ssr_import_0__ = await __vite_ssr_import__("vue", {"importedNames":["fn"]});function A({foo = __vite_ssr_import_0__.fn}){ return {}; }"`,
)
expect(result?.deps).toEqual(['vue'])
})

test('do not rewrite when function declaration is in scope', async () => {
const result = await ssrTransformSimple(
`import { fn } from 'vue';function A(){ function fn() {}; return { fn }; }`,
)
expect(result?.code).toMatchInlineSnapshot(`"const __vite_ssr_import_0__ = await __vite_ssr_import__("vue", {"importedNames":["fn"]});function A(){ function fn() {}; return { fn }; }"`)
expect(result?.code).toMatchInlineSnapshot(
`"const __vite_ssr_import_0__ = await __vite_ssr_import__("vue", {"importedNames":["fn"]});function A(){ function fn() {}; return { fn }; }"`,
)
expect(result?.deps).toEqual(['vue'])
})

Expand All @@ -257,44 +281,56 @@ test('do not rewrite when function expression is in scope', async () => {
const result = await ssrTransformSimple(
`import {fn} from './vue';var a = function() { return function fn() { console.log(fn) } }`,
)
expect(result?.code).toMatchInlineSnapshot(`"const __vite_ssr_import_0__ = await __vite_ssr_import__("./vue", {"importedNames":["fn"]});var a = function() { return function fn() { console.log(fn) } }"`)
expect(result?.code).toMatchInlineSnapshot(
`"const __vite_ssr_import_0__ = await __vite_ssr_import__("./vue", {"importedNames":["fn"]});var a = function() { return function fn() { console.log(fn) } }"`,
)
})

// #16452
test('do not rewrite when function expression is in global scope', async () => {
const result = await ssrTransformSimple(
`import {fn} from './vue';foo(function fn(a = fn) { console.log(fn) })`,
)
expect(result?.code).toMatchInlineSnapshot(`"const __vite_ssr_import_0__ = await __vite_ssr_import__("./vue", {"importedNames":["fn"]});foo(function fn(a = fn) { console.log(fn) })"`)
expect(result?.code).toMatchInlineSnapshot(
`"const __vite_ssr_import_0__ = await __vite_ssr_import__("./vue", {"importedNames":["fn"]});foo(function fn(a = fn) { console.log(fn) })"`,
)
})

test('do not rewrite when class declaration is in scope', async () => {
const result = await ssrTransformSimple(
`import { cls } from 'vue';function A(){ class cls {} return { cls }; }`,
)
expect(result?.code).toMatchInlineSnapshot(`"const __vite_ssr_import_0__ = await __vite_ssr_import__("vue", {"importedNames":["cls"]});function A(){ class cls {} return { cls }; }"`)
expect(result?.code).toMatchInlineSnapshot(
`"const __vite_ssr_import_0__ = await __vite_ssr_import__("vue", {"importedNames":["cls"]});function A(){ class cls {} return { cls }; }"`,
)
expect(result?.deps).toEqual(['vue'])
})

test('do not rewrite when class expression is in scope', async () => {
const result = await ssrTransformSimple(
`import { cls } from './vue';var a = function() { return class cls { constructor() { console.log(cls) } } }`,
)
expect(result?.code).toMatchInlineSnapshot(`"const __vite_ssr_import_0__ = await __vite_ssr_import__("./vue", {"importedNames":["cls"]});var a = function() { return class cls { constructor() { console.log(cls) } } }"`)
expect(result?.code).toMatchInlineSnapshot(
`"const __vite_ssr_import_0__ = await __vite_ssr_import__("./vue", {"importedNames":["cls"]});var a = function() { return class cls { constructor() { console.log(cls) } } }"`,
)
})

test('do not rewrite when class expression is in global scope', async () => {
const result = await ssrTransformSimple(
`import { cls } from './vue';foo(class cls { constructor() { console.log(cls) } })`,
)
expect(result?.code).toMatchInlineSnapshot(`"const __vite_ssr_import_0__ = await __vite_ssr_import__("./vue", {"importedNames":["cls"]});foo(class cls { constructor() { console.log(cls) } })"`)
expect(result?.code).toMatchInlineSnapshot(
`"const __vite_ssr_import_0__ = await __vite_ssr_import__("./vue", {"importedNames":["cls"]});foo(class cls { constructor() { console.log(cls) } })"`,
)
})

test('do not rewrite catch clause', async () => {
const result = await ssrTransformSimple(
`import {error} from './dependency';try {} catch(error) {}`,
)
expect(result?.code).toMatchInlineSnapshot(`"const __vite_ssr_import_0__ = await __vite_ssr_import__("./dependency", {"importedNames":["error"]});try {} catch(error) {}"`)
expect(result?.code).toMatchInlineSnapshot(
`"const __vite_ssr_import_0__ = await __vite_ssr_import__("./dependency", {"importedNames":["error"]});try {} catch(error) {}"`,
)
expect(result?.deps).toEqual(['./dependency'])
})

Expand Down