Skip to content

Commit cafae27

Browse files
anpatoanpato
authored
Fixing ast transform for aliased imports (#251)
1 parent e539f57 commit cafae27

6 files changed

Lines changed: 286 additions & 3 deletions

File tree

‎packages/react-router-devtools/src/vite/utils/data-functions-augment.test.ts‎

Lines changed: 93 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -722,6 +722,99 @@ describe("transform", () => {
722722
})
723723
})
724724

725+
describe("aliased import transforms", () => {
726+
it("should transform aliased loader import where local name is loader", () => {
727+
const result = augmentDataFetchingFunctions(
728+
`
729+
import { myLoader as loader } from "./loaders";
730+
export { loader };
731+
`,
732+
"test",
733+
"/file/path"
734+
)
735+
const expected = removeWhitespace(`
736+
import { withLoaderWrapper as _withLoaderWrapper } from "react-router-devtools/server";
737+
import { myLoader as _loader } from "./loaders";
738+
export const loader = _withLoaderWrapper(_loader, "test");
739+
`)
740+
expect(removeWhitespace(result.code)).toStrictEqual(expected)
741+
})
742+
743+
it("should transform aliased action import where local name is action", () => {
744+
const result = augmentDataFetchingFunctions(
745+
`
746+
import { myLoaderAction as action } from "./actions";
747+
export { action };
748+
`,
749+
"test",
750+
"/file/path"
751+
)
752+
const expected = removeWhitespace(`
753+
import { withActionWrapper as _withActionWrapper } from "react-router-devtools/server";
754+
import { myLoaderAction as _action } from "./actions";
755+
export const action = _withActionWrapper(_action, "test");
756+
`)
757+
expect(removeWhitespace(result.code)).toStrictEqual(expected)
758+
})
759+
760+
it("should transform aliased clientLoader import where local name is clientLoader", () => {
761+
const result = augmentDataFetchingFunctions(
762+
`
763+
import { myLoaderClientLoader as clientLoader } from "./loaders";
764+
export { clientLoader };
765+
`,
766+
"test",
767+
"/file/path"
768+
)
769+
const expected = removeWhitespace(`
770+
import { withClientLoaderWrapper as _withClientLoaderWrapper } from "react-router-devtools/client";
771+
import { myLoaderClientLoader as _clientLoader } from "./loaders";
772+
export const clientLoader = _withClientLoaderWrapper(_clientLoader, "test");
773+
`)
774+
expect(removeWhitespace(result.code)).toStrictEqual(expected)
775+
})
776+
777+
it("should transform aliased clientAction import where local name is clientAction", () => {
778+
const result = augmentDataFetchingFunctions(
779+
`
780+
import { myLoaderClientAction as clientAction } from "./actions";
781+
export { clientAction };
782+
`,
783+
"test",
784+
"/file/path"
785+
)
786+
const expected = removeWhitespace(`
787+
import { withClientActionWrapper as _withClientActionWrapper } from "react-router-devtools/client";
788+
import { myLoaderClientAction as _clientAction } from "./actions";
789+
export const clientAction = _withClientActionWrapper(_clientAction, "test");
790+
`)
791+
expect(removeWhitespace(result.code)).toStrictEqual(expected)
792+
})
793+
794+
it("should transform aliased loader import and update usages in code", () => {
795+
const result = augmentDataFetchingFunctions(
796+
`
797+
import { myLoader as loader } from "./loaders";
798+
const test = () => {
799+
return loader();
800+
}
801+
export { loader };
802+
`,
803+
"test",
804+
"/file/path"
805+
)
806+
const expected = removeWhitespace(`
807+
import { withLoaderWrapper as _withLoaderWrapper } from "react-router-devtools/server";
808+
import { myLoader as _loader } from "./loaders";
809+
const test = () => {
810+
return _loader();
811+
};
812+
export const loader = _withLoaderWrapper(_loader, "test");
813+
`)
814+
expect(removeWhitespace(result.code)).toStrictEqual(expected)
815+
})
816+
})
817+
725818
it("should transform the re-exports when it's re-exported from another file with multiple re-exports", () => {
726819
const result = augmentDataFetchingFunctions(
727820
`

‎packages/react-router-devtools/src/vite/utils/data-functions-augment.ts‎

Lines changed: 11 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -43,7 +43,17 @@ const transform = (ast: ParseResult<Babel.File>, routeId: string) => {
4343
if (!t.isImportSpecifier(specifier) || !t.isIdentifier(specifier.imported)) {
4444
continue
4545
}
46-
const name = specifier.imported.name
46+
const importedName = specifier.imported.name
47+
const localName = specifier.local.name
48+
// Handle aliased imports where local name is a target export
49+
// e.g., import { myLoader as loader }
50+
if (ALL_EXPORTS.includes(localName) && !ALL_EXPORTS.includes(importedName)) {
51+
const uniqueName = path.scope.generateUidIdentifier(localName)
52+
imports.push([localName, uniqueName])
53+
path.scope.rename(localName, uniqueName.name)
54+
continue
55+
}
56+
const name = importedName
4757
if (!ALL_EXPORTS.includes(name)) {
4858
continue
4959
}

‎packages/react-router-devtools/src/vite/utils/inject-context.test.ts‎

Lines changed: 93 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -622,6 +622,99 @@ describe("transform", () => {
622622
})
623623
})
624624

625+
describe("aliased import transforms", () => {
626+
it("should transform aliased loader import where local name is loader", () => {
627+
const result = injectContext(
628+
`
629+
import { myLoader as loader } from "./loaders";
630+
export { loader };
631+
`,
632+
"test",
633+
"/file/path"
634+
)
635+
const expected = removeWhitespace(`
636+
import { withLoaderContextWrapper as _withLoaderContextWrapper } from "react-router-devtools/context";
637+
import { myLoader as _loader } from "./loaders";
638+
export const loader = _withLoaderContextWrapper(_loader, "test");
639+
`)
640+
expect(removeWhitespace(result.code)).toStrictEqual(expected)
641+
})
642+
643+
it("should transform aliased action import where local name is action", () => {
644+
const result = injectContext(
645+
`
646+
import { myLoaderAction as action } from "./actions";
647+
export { action };
648+
`,
649+
"test",
650+
"/file/path"
651+
)
652+
const expected = removeWhitespace(`
653+
import { withActionContextWrapper as _withActionContextWrapper } from "react-router-devtools/context";
654+
import { myLoaderAction as _action } from "./actions";
655+
export const action = _withActionContextWrapper(_action, "test");
656+
`)
657+
expect(removeWhitespace(result.code)).toStrictEqual(expected)
658+
})
659+
660+
it("should transform aliased clientLoader import where local name is clientLoader", () => {
661+
const result = injectContext(
662+
`
663+
import { myLoaderClientLoader as clientLoader } from "./loaders";
664+
export { clientLoader };
665+
`,
666+
"test",
667+
"/file/path"
668+
)
669+
const expected = removeWhitespace(`
670+
import { withClientLoaderContextWrapper as _withClientLoaderContextWrapper } from "react-router-devtools/context";
671+
import { myLoaderClientLoader as _clientLoader } from "./loaders";
672+
export const clientLoader = _withClientLoaderContextWrapper(_clientLoader, "test");
673+
`)
674+
expect(removeWhitespace(result.code)).toStrictEqual(expected)
675+
})
676+
677+
it("should transform aliased clientAction import where local name is clientAction", () => {
678+
const result = injectContext(
679+
`
680+
import { myLoaderClientAction as clientAction } from "./actions";
681+
export { clientAction };
682+
`,
683+
"test",
684+
"/file/path"
685+
)
686+
const expected = removeWhitespace(`
687+
import { withClientActionContextWrapper as _withClientActionContextWrapper } from "react-router-devtools/context";
688+
import { myLoaderClientAction as _clientAction } from "./actions";
689+
export const clientAction = _withClientActionContextWrapper(_clientAction, "test");
690+
`)
691+
expect(removeWhitespace(result.code)).toStrictEqual(expected)
692+
})
693+
694+
it("should transform aliased loader import and update usages in code", () => {
695+
const result = injectContext(
696+
`
697+
import { myLoader as loader } from "./loaders";
698+
const test = () => {
699+
return loader();
700+
}
701+
export { loader };
702+
`,
703+
"test",
704+
"/file/path"
705+
)
706+
const expected = removeWhitespace(`
707+
import { withLoaderContextWrapper as _withLoaderContextWrapper } from "react-router-devtools/context";
708+
import { myLoader as _loader } from "./loaders";
709+
const test = () => {
710+
return _loader();
711+
};
712+
export const loader = _withLoaderContextWrapper(_loader, "test");
713+
`)
714+
expect(removeWhitespace(result.code)).toStrictEqual(expected)
715+
})
716+
})
717+
625718
it("should transform the re-exports when it's re-exported from another file with multiple re-exports", () => {
626719
const result = injectContext(
627720
`

‎packages/react-router-devtools/src/vite/utils/inject-context.ts‎

Lines changed: 11 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -33,7 +33,17 @@ const transform = (ast: ParseResult<Babel.File>, routeId: string) => {
3333
if (!t.isImportSpecifier(specifier) || !t.isIdentifier(specifier.imported)) {
3434
continue
3535
}
36-
const name = specifier.imported.name
36+
const importedName = specifier.imported.name
37+
const localName = specifier.local.name
38+
// Handle aliased imports where local name is a target export
39+
// e.g., import { myLoader as loader }
40+
if (ALL_EXPORTS.includes(localName) && !ALL_EXPORTS.includes(importedName)) {
41+
const uniqueName = path.scope.generateUidIdentifier(localName)
42+
imports.push([localName, uniqueName])
43+
path.scope.rename(localName, uniqueName.name)
44+
continue
45+
}
46+
const name = importedName
3747
if (!ALL_EXPORTS.includes(name)) {
3848
continue
3949
}

‎packages/react-router-devtools/src/vite/utils/middleware-augment.test.ts‎

Lines changed: 67 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -630,4 +630,71 @@ describe("middleware augmentation", () => {
630630
expect(result.code).toContain('"authMiddleware"')
631631
})
632632
})
633+
634+
describe("aliased import transforms", () => {
635+
it("should transform aliased middleware import where local name is middleware", () => {
636+
const result = augmentMiddlewareFunctions(
637+
`
638+
import { authMiddleware as middleware } from "./middlewares";
639+
export { middleware };
640+
`,
641+
"test",
642+
"/file/path"
643+
)
644+
// Should skip transformation for re-exported imported middleware
645+
// The aliased import handler renames it but since it's imported and re-exported, it skips
646+
expect(result.code).toContain("authMiddleware")
647+
})
648+
649+
it("should transform aliased clientMiddleware import where local name is clientMiddleware", () => {
650+
const result = augmentMiddlewareFunctions(
651+
`
652+
import { clientAuthMiddleware as clientMiddleware } from "./middlewares";
653+
export { clientMiddleware };
654+
`,
655+
"test",
656+
"/file/path"
657+
)
658+
// Should skip transformation for re-exported imported middleware
659+
expect(result.code).toContain("clientAuthMiddleware")
660+
})
661+
662+
it("should handle aliased middleware import used in array", () => {
663+
const result = augmentMiddlewareFunctions(
664+
`
665+
import { someAuthFn as authMiddleware } from "./auth";
666+
export const middleware = [authMiddleware];
667+
`,
668+
"test",
669+
"/file/path"
670+
)
671+
const expected = removeWhitespace(`
672+
import { withMiddlewareWrapperSingle as _withMiddlewareWrapperSingle } from "react-router-devtools/server";
673+
import { someAuthFn as authMiddleware } from "./auth";
674+
export const middleware = [
675+
_withMiddlewareWrapperSingle(authMiddleware, "test", 0, "authMiddleware")
676+
];
677+
`)
678+
expect(removeWhitespace(result.code)).toStrictEqual(expected)
679+
})
680+
681+
it("should handle aliased clientMiddleware import used in array", () => {
682+
const result = augmentMiddlewareFunctions(
683+
`
684+
import { someClientAuthFn as clientAuthMiddleware } from "./auth";
685+
export const clientMiddleware = [clientAuthMiddleware];
686+
`,
687+
"test",
688+
"/file/path"
689+
)
690+
const expected = removeWhitespace(`
691+
import { withClientMiddlewareWrapperSingle as _withClientMiddlewareWrapperSingle } from "react-router-devtools/client";
692+
import { someClientAuthFn as clientAuthMiddleware } from "./auth";
693+
export const clientMiddleware = [
694+
_withClientMiddlewareWrapperSingle(clientAuthMiddleware, "test", 0, "clientAuthMiddleware")
695+
];
696+
`)
697+
expect(removeWhitespace(result.code)).toStrictEqual(expected)
698+
})
699+
})
633700
})

‎packages/react-router-devtools/src/vite/utils/middleware-augment.ts‎

Lines changed: 11 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -46,7 +46,17 @@ const transform = (ast: ParseResult<Babel.File>, routeId: string) => {
4646
if (!t.isImportSpecifier(specifier) || !t.isIdentifier(specifier.imported)) {
4747
continue
4848
}
49-
const name = specifier.imported.name
49+
const importedName = specifier.imported.name
50+
const localName = specifier.local.name
51+
// Handle aliased imports where local name is a target export
52+
// e.g., import { someMiddleware as middleware }
53+
if (ALL_MIDDLEWARE_EXPORTS.includes(localName) && !ALL_MIDDLEWARE_EXPORTS.includes(importedName)) {
54+
const uniqueName = path.scope.generateUidIdentifier(localName)
55+
imports.push([localName, uniqueName])
56+
path.scope.rename(localName, uniqueName.name)
57+
continue
58+
}
59+
const name = importedName
5060
if (!ALL_MIDDLEWARE_EXPORTS.includes(name)) {
5161
continue
5262
}

0 commit comments

Comments
 (0)