Skip to content
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

Jump to bottom

fix(ssr-compiler): add SSR for lwc:component #4000

Open
wants to merge 13 commits into
base: master
Choose a base branch
from
Open

fix(ssr-compiler): add SSR for lwc:component #4000

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
13 commits
Select commit Hold shift + click to select a range
1364d55
chore: update fixtures to accommodate SSR compiler
divmain Feb 6, 2024
a5425a2
chore: add package-local test command
divmain Feb 6, 2024
3b256d6
feat: experimental SSR compiler
divmain Feb 6, 2024
3f1677a
chore: address PR feedback
divmain Feb 8, 2024
bf43fac
chore: re-add acorn for estemplate
divmain Feb 12, 2024
923e065
chore: test changes
divmain Feb 12, 2024
364c638
chore: fixes to esTemplate, tests, & follow-up fixes
divmain Feb 12, 2024
c6da245
chore: remove no-op
divmain Feb 12, 2024
fb0645c
chore: update README
divmain Feb 12, 2024
a5139bc
fix(ssr-compiler): add SSR for `lwc:component`
abdulsattar Feb 19, 2024
db3322f
fix(ssr-compiler): generate uid for every imported child generateMarkup
abdulsattar Feb 20, 2024
3d902e5
fix(ssr-compiler): add test for two components
abdulsattar Feb 20, 2024
b466dd3
fix: add comments
abdulsattar Feb 21, 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
1 change: 1 addition & 0 deletions packages/@lwc/compiler/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -51,6 +51,7 @@
"@lwc/babel-plugin-component": "6.1.1",
"@lwc/errors": "6.1.1",
"@lwc/shared": "6.1.1",
"@lwc/ssr-compiler": "6.1.1",
"@lwc/style-compiler": "6.1.1",
"@lwc/template-compiler": "6.1.1"
}
Expand Down
1 change: 1 addition & 0 deletions packages/@lwc/compiler/src/index.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@ export { transform, transformSync } from './transformers/transformer';

export { TransformResult } from './transformers/transformer';
export {
NormalizedTransformOptions,
TransformOptions,
StylesheetConfig,
CustomPropertiesResolution,
Expand Down
2 changes: 2 additions & 0 deletions packages/@lwc/compiler/src/options.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -103,6 +103,7 @@ export interface TransformOptions {
enableLightningWebSecurityTransforms?: boolean;
instrumentation?: InstrumentationObject;
apiVersion?: number;
targetSSR?: boolean;
}

type RequiredTransformOptions = Omit<
Expand Down Expand Up @@ -208,5 +209,6 @@ function normalizeOptions(options: TransformOptions): NormalizedTransformOptions
outputConfig,
experimentalDynamicComponent,
apiVersion,
targetSSR: !!options.targetSSR,
};
}
5 changes: 3 additions & 2 deletions packages/@lwc/compiler/src/transformers/transformer.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,7 @@ import {
invariant,
CompilerDiagnostic,
} from '@lwc/errors';
import { compileComponentForSSR, compileTemplateForSSR } from '@lwc/ssr-compiler';

import { NormalizedTransformOptions, TransformOptions, validateTransformOptions } from '../options';
import styleTransform from './style';
Expand Down Expand Up @@ -76,7 +77,7 @@ function transformFile(

switch (path.extname(filename)) {
case '.html':
transformer = templateTransformer;
transformer = options.targetSSR ? compileTemplateForSSR : templateTransformer;
break;

case '.css':
Expand All @@ -85,7 +86,7 @@ function transformFile(

case '.ts':
case '.js':
transformer = scriptTransformer;
transformer = options.targetSSR ? compileComponentForSSR : scriptTransformer;
break;

default:
Expand Down
1 change: 1 addition & 0 deletions packages/@lwc/engine-server/src/__tests__/fixtures/attribute-aria-modify/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,2 +1,3 @@
export const tagName = 'x-cmp';
export { default } from 'x/cmp';
export * from 'x/cmp';
1 change: 1 addition & 0 deletions packages/@lwc/engine-server/src/__tests__/fixtures/attribute-aria/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,2 +1,3 @@
export const tagName = 'x-parent';
export { default } from 'x/parent';
export * from 'x/parent';
3 changes: 2 additions & 1 deletion packages/@lwc/engine-server/src/__tests__/fixtures/attribute-boolean/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,2 +1,3 @@
export const tagName = 'x-attribute-boolean';
export { default } from 'x/attribute-boolean';
export { default } from 'x/attribute-boolean';
export * from 'x/attribute-boolean';
3 changes: 2 additions & 1 deletion packages/@lwc/engine-server/src/__tests__/fixtures/attribute-component-aria/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,2 +1,3 @@
export const tagName = 'x-attribute-component-aria';
export { default } from 'x/attribute-component-aria';
export { default } from 'x/attribute-component-aria';
export * from 'x/attribute-component-aria';
3 changes: 2 additions & 1 deletion packages/@lwc/engine-server/src/__tests__/fixtures/attribute-component-global-html/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,2 +1,3 @@
export const tagName = 'x-attribute-component-global-html';
export { default } from 'x/attribute-component-global-html';
export { default } from 'x/attribute-component-global-html';
export * from 'x/attribute-component-global-html';
3 changes: 2 additions & 1 deletion packages/@lwc/engine-server/src/__tests__/fixtures/attribute-dynamic-escape/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,2 +1,3 @@
export const tagName = 'x-attribute-dynamic-escape';
export { default } from 'x/attribute-dynamic-escape';
export { default } from 'x/attribute-dynamic-escape';
export * from 'x/attribute-dynamic-escape';
3 changes: 2 additions & 1 deletion ...ages/@lwc/engine-server/src/__tests__/fixtures/attribute-dynamic-with-scoped-css/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,2 +1,3 @@
export const tagName = 'x-attribute-dynamic-with-scoped-css';
export { default } from 'x/attribute-dynamic-with-scoped-css';
export { default } from 'x/attribute-dynamic-with-scoped-css';
export * from 'x/attribute-dynamic-with-scoped-css';
3 changes: 2 additions & 1 deletion packages/@lwc/engine-server/src/__tests__/fixtures/attribute-dynamic/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,2 +1,3 @@
export const tagName = 'x-attribute-dynamic';
export { default } from 'x/attribute-dynamic';
export { default } from 'x/attribute-dynamic';
export * from 'x/attribute-dynamic';
3 changes: 2 additions & 1 deletion packages/@lwc/engine-server/src/__tests__/fixtures/attribute-global-html/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,2 +1,3 @@
export const tagName = 'x-attribute-global-html';
export { default } from 'x/attribute-global-html';
export { default } from 'x/attribute-global-html';
export * from 'x/attribute-global-html';
3 changes: 2 additions & 1 deletion packages/@lwc/engine-server/src/__tests__/fixtures/attribute-live-bindings/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,2 +1,3 @@
export const tagName = 'x-attribute-live-bindings';
export { default } from 'x/attribute-live-bindings';
export { default } from 'x/attribute-live-bindings';
export * from 'x/attribute-live-bindings';
3 changes: 2 additions & 1 deletion packages/@lwc/engine-server/src/__tests__/fixtures/attribute-static/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,2 +1,3 @@
export const tagName = 'x-attribute-static';
export { default } from 'x/attribute-static';
export { default } from 'x/attribute-static';
export * from 'x/attribute-static';
3 changes: 2 additions & 1 deletion packages/@lwc/engine-server/src/__tests__/fixtures/attribute-style/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,2 +1,3 @@
export const tagName = 'x-attribute-style';
export { default } from 'x/attribute-style';
export { default } from 'x/attribute-style';
export * from 'x/attribute-style';
3 changes: 2 additions & 1 deletion packages/@lwc/engine-server/src/__tests__/fixtures/attributes-aria/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,2 +1,3 @@
export const tagName = 'x-attributes-aria';
export { default } from 'x/attributes-aria';
export { default } from 'x/attributes-aria';
export * from 'x/attributes-aria';
3 changes: 2 additions & 1 deletion packages/@lwc/engine-server/src/__tests__/fixtures/comments-basic/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,2 +1,3 @@
export const tagName = 'x-comments-basic';
export { default } from 'x/comments-basic';
export { default } from 'x/comments-basic';
export * from 'x/comments-basic';
3 changes: 2 additions & 1 deletion packages/@lwc/engine-server/src/__tests__/fixtures/comments-foreach/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,2 +1,3 @@
export const tagName = 'x-comments-foreach';
export { default } from 'x/comments-foreach';
export { default } from 'x/comments-foreach';
export * from 'x/comments-foreach';
3 changes: 2 additions & 1 deletion packages/@lwc/engine-server/src/__tests__/fixtures/comments-if/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,2 +1,3 @@
export const tagName = 'x-comments-if';
export { default } from 'x/comments-if';
export { default } from 'x/comments-if';
export * from 'x/comments-if';
3 changes: 2 additions & 1 deletion packages/@lwc/engine-server/src/__tests__/fixtures/comments-slot/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,2 +1,3 @@
export const tagName = 'x-comments-slot';
export { default } from 'x/comments-slot';
export { default } from 'x/comments-slot';
export * from 'x/comments-slot';
5 changes: 5 additions & 0 deletions packages/@lwc/engine-server/src/__tests__/fixtures/component/expected.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,5 +5,10 @@
I am a child component
</template>
</x-child>
<x-anotherchild>
<template shadowrootmode="open">
I am another child component
</template>
</x-anotherchild>
</template>
</x-component>
3 changes: 2 additions & 1 deletion packages/@lwc/engine-server/src/__tests__/fixtures/component/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,2 +1,3 @@
export const tagName = 'x-component';
export { default } from 'x/component';
export { default } from 'x/component';
export * from 'x/component';
1 change: 1 addition & 0 deletions ...es/@lwc/engine-server/src/__tests__/fixtures/component/modules/x/component/component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
<template>
<x-child></x-child>
<x-anotherchild></x-anotherchild>
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't see a test here for <lwc:component> ...?

BTW this is a good example of why it'd be nice to have the compiler output as part of the snapshots... would help with visualizing the generated code.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This tests the import statement we add when we see a child in the template. lwc:component are imported in the JS by the user.

Specifically, here db3322f#diff-17a5fc2e6a05c3f1e674d6942273c831cb914d8d3c3286062c429e5054465bdfR101, we increment UID to add unique import statements for each child.
e.g.

import { generateMarkup as generateMarkup_1 } from 'x/child';
import { generateMarkup as generateMarkup_2 } from 'x/anotherchild';

Definitely agree with having the compiler output in snapshots. This would have been clearer.

</template>
3 changes: 2 additions & 1 deletion packages/@lwc/engine-server/src/__tests__/fixtures/computed/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,2 +1,3 @@
export const tagName = 'x-computed';
export { default } from 'x/computed';
export { default } from 'x/computed';
export * from 'x/computed';
1 change: 1 addition & 0 deletions packages/@lwc/engine-server/src/__tests__/fixtures/context-deep/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,2 +1,3 @@
export const tagName = 'x-provider';
export { default } from 'x/provider';
export * from 'x/provider';
1 change: 1 addition & 0 deletions ...es/@lwc/engine-server/src/__tests__/fixtures/context-installation-on-non-element/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,2 +1,3 @@
export const tagName = 'x-provider';
export { default } from 'x/provider';
export * from 'x/provider';
1 change: 1 addition & 0 deletions packages/@lwc/engine-server/src/__tests__/fixtures/context-nested/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,2 +1,3 @@
export const tagName = 'x-provider';
export { default } from 'x/provider';
export * from 'x/provider';
1 change: 1 addition & 0 deletions packages/@lwc/engine-server/src/__tests__/fixtures/context-no-provider/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,2 +1,3 @@
export const tagName = 'x-parent';
export { default } from 'x/parent';
export * from 'x/parent';
1 change: 1 addition & 0 deletions packages/@lwc/engine-server/src/__tests__/fixtures/context-shadowed/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,2 +1,3 @@
export const tagName = 'x-provider';
export { default } from 'x/provider';
export * from 'x/provider';
1 change: 1 addition & 0 deletions packages/@lwc/engine-server/src/__tests__/fixtures/context-simple/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,2 +1,3 @@
export const tagName = 'x-provider';
export { default } from 'x/provider';
export * from 'x/provider';
1 change: 1 addition & 0 deletions packages/@lwc/engine-server/src/__tests__/fixtures/context-slotted/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,2 +1,3 @@
export const tagName = 'x-root';
export { default } from 'x/root';
export * from 'x/root';
3 changes: 2 additions & 1 deletion packages/@lwc/engine-server/src/__tests__/fixtures/custom-styles-with-newlines/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,2 +1,3 @@
export const tagName = 'x-component';
export { default } from 'x/component';
export { default } from 'x/component';
export * from 'x/component';
Loading