[examples] Add examples with Preact project type test #4111

augustjk · 2023-08-17T00:59:37Z

Changes

Convert top level examples/ directory to be part of npm workspaces
- Ultimately this will make it easier to add examples that make use of monorepo packages and run tests on them
- This required loosening nextjs example dependencies and deduplicating packages
Add test-elements-react package to labs/test-projects/ that include a subset of components from test-element-a wrapped with @lit-labs/react
Add preact example project to top level examples/ directory that import test-element-react and has a tsc --noEmit test to make sure types are compatible.

Resolves #3289

changeset-bot · 2023-08-17T00:59:40Z

🦋 Changeset detected

Latest commit: 53b40ef

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 0 packages

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

github-actions · 2023-08-17T00:59:53Z

📊 Tachometer Benchmark Results

Summary

nop-update

this-change, tip-of-tree, previous-release: unsure 🔍 -7% - +7% (-1.68ms - +1.66ms)
^{this-change vs tip-of-tree}

render

this-change: 83.76ms - 88.36ms
this-change, tip-of-tree, previous-release: unsure 🔍 -3% - +8% (-0.99ms - +2.63ms)
^{this-change vs tip-of-tree}
this-change, tip-of-tree, previous-release: unsure 🔍 -4% - +0% (-2.49ms - +0.11ms)
^{this-change vs tip-of-tree}
this-change, tip-of-tree, previous-release: unsure 🔍 -4% - +1% (-2.02ms - +0.41ms)
^{this-change vs tip-of-tree}

update

this-change: 920.68ms - 938.17ms
this-change, tip-of-tree, previous-release: unsure 🔍 -5% - +3% (-4.68ms - +3.00ms)
^{this-change vs tip-of-tree}
this-change, tip-of-tree, previous-release: unsure 🔍 -1% - +2% (-1.01ms - +3.15ms)
^{this-change vs tip-of-tree}
this-change, tip-of-tree, previous-release: unsure 🔍 -1% - +1% (-10.60ms - +12.09ms)
^{this-change vs tip-of-tree}

update-reflect

this-change: 872.81ms - 885.80ms
this-change, tip-of-tree, previous-release: unsure 🔍 -2% - +1% (-14.82ms - +6.80ms)
^{this-change vs tip-of-tree}

Results

this-change

Browser: chrome-headless 116.0.5845.96
Sample size: 50
Built by: Benchmarks #5345
Commit: 53b40ef

render

Version	Avg time	vs
	83.76ms - 88.36ms	-

update

Version	Avg time	vs
	920.68ms - 938.17ms	-

update-reflect

Version	Avg time	vs
	872.81ms - 885.80ms	-

this-change, tip-of-tree, previous-release

Browser: chrome-headless 116.0.5845.96
Sample size: 30
Built by: Benchmarks #5345
Commit: 53b40ef

render

Version	Avg time	vs this-change	vs tip-of-tree tip-of-tree	vs previous-release previous-release
this-change	33.03ms - 35.50ms	-	unsure 🔍 -3% - +8% -0.99ms - +2.63ms	unsure 🔍 -4% - +6% -1.21ms - +2.02ms
tip-of-tree tip-of-tree	32.13ms - 34.76ms	unsure 🔍 -8% - +3% -2.63ms - +0.99ms	-	unsure 🔍 -6% - +4% -2.09ms - +1.26ms
previous-release previous-release	32.83ms - 34.90ms	unsure 🔍 -6% - +4% -2.02ms - +1.21ms	unsure 🔍 -4% - +6% -1.26ms - +2.09ms	-

update

Version	Avg time	vs this-change	vs tip-of-tree tip-of-tree	vs previous-release previous-release
this-change	91.73ms - 97.11ms	-	unsure 🔍 -5% - +3% -4.68ms - +3.00ms	unsure 🔍 -4% - +4% -3.88ms - +3.91ms
tip-of-tree tip-of-tree	92.51ms - 98.01ms	unsure 🔍 -3% - +5% -3.00ms - +4.68ms	-	unsure 🔍 -3% - +5% -3.08ms - +4.79ms
previous-release previous-release	91.59ms - 97.22ms	unsure 🔍 -4% - +4% -3.91ms - +3.88ms	unsure 🔍 -5% - +3% -4.79ms - +3.08ms	-

nop-update

Version	Avg time	vs this-change	vs tip-of-tree tip-of-tree	vs previous-release previous-release
this-change	22.66ms - 25.00ms	-	unsure 🔍 -7% - +7% -1.68ms - +1.66ms	unsure 🔍 -4% - +9% -1.01ms - +1.99ms
tip-of-tree tip-of-tree	22.65ms - 25.03ms	unsure 🔍 -7% - +7% -1.66ms - +1.68ms	-	unsure 🔍 -4% - +9% -1.02ms - +2.02ms
previous-release previous-release	22.40ms - 24.29ms	unsure 🔍 -8% - +4% -1.99ms - +1.01ms	unsure 🔍 -8% - +4% -2.02ms - +1.02ms	-

this-change, tip-of-tree, previous-release

Browser: chrome-headless 116.0.5845.96
Sample size: 50
Built by: Benchmarks #5345
Commit: 53b40ef

render

Version	Avg time	vs this-change	vs tip-of-tree tip-of-tree	vs previous-release previous-release
this-change	61.06ms - 62.38ms	-	unsure 🔍 -4% - +0% -2.49ms - +0.11ms	unsure 🔍 -2% - +2% -1.10ms - +1.16ms
tip-of-tree tip-of-tree	61.80ms - 64.02ms	unsure 🔍 -0% - +4% -0.11ms - +2.49ms	-	unsure 🔍 -0% - +4% -0.22ms - +2.66ms
previous-release previous-release	60.77ms - 62.61ms	unsure 🔍 -2% - +2% -1.16ms - +1.10ms	unsure 🔍 -4% - +0% -2.66ms - +0.22ms	-

update

Version	Avg time	vs this-change	vs tip-of-tree tip-of-tree	vs previous-release previous-release
this-change	138.56ms - 140.95ms	-	unsure 🔍 -1% - +2% -1.01ms - +3.15ms	unsure 🔍 -1% - +1% -1.78ms - +1.94ms
tip-of-tree tip-of-tree	136.98ms - 140.39ms	unsure 🔍 -2% - +1% -3.15ms - +1.01ms	-	unsure 🔍 -2% - +1% -3.21ms - +1.24ms
previous-release previous-release	138.24ms - 141.11ms	unsure 🔍 -1% - +1% -1.94ms - +1.78ms	unsure 🔍 -1% - +2% -1.24ms - +3.21ms	-

this-change, tip-of-tree, previous-release

Browser: chrome-headless 116.0.5845.96
Sample size: 50
Built by: Benchmarks #5345
Commit: 53b40ef

render

Version	Avg time	vs this-change	vs tip-of-tree tip-of-tree	vs previous-release previous-release
this-change	50.32ms - 51.98ms	-	unsure 🔍 -4% - +1% -2.02ms - +0.41ms	unsure 🔍 -3% - +2% -1.50ms - +1.01ms
tip-of-tree tip-of-tree	51.07ms - 52.84ms	unsure 🔍 -1% - +4% -0.41ms - +2.02ms	-	unsure 🔍 -1% - +4% -0.73ms - +1.85ms
previous-release previous-release	50.45ms - 52.34ms	unsure 🔍 -2% - +3% -1.01ms - +1.50ms	unsure 🔍 -4% - +1% -1.85ms - +0.73ms	-

update

Version	Avg time	vs this-change	vs tip-of-tree tip-of-tree	vs previous-release previous-release
this-change	925.67ms - 942.40ms	-	unsure 🔍 -1% - +1% -10.60ms - +12.09ms	unsure 🔍 -1% - +1% -10.01ms - +12.66ms
tip-of-tree tip-of-tree	925.63ms - 940.96ms	unsure 🔍 -1% - +1% -12.09ms - +10.60ms	-	unsure 🔍 -1% - +1% -10.24ms - +11.41ms
previous-release previous-release	925.07ms - 940.36ms	unsure 🔍 -1% - +1% -12.66ms - +10.01ms	unsure 🔍 -1% - +1% -11.41ms - +10.24ms	-

update-reflect

Version	Avg time	vs this-change	vs tip-of-tree tip-of-tree	vs previous-release previous-release
this-change	914.07ms - 928.39ms	-	unsure 🔍 -2% - +1% -14.82ms - +6.80ms	unsure 🔍 -1% - +1% -8.97ms - +12.85ms
tip-of-tree tip-of-tree	917.14ms - 933.34ms	unsure 🔍 -1% - +2% -6.80ms - +14.82ms	-	unsure 🔍 -1% - +2% -5.60ms - +17.50ms
previous-release previous-release	911.06ms - 927.52ms	unsure 🔍 -1% - +1% -12.85ms - +8.97ms	unsure 🔍 -2% - +1% -17.50ms - +5.60ms	-

_{tachometer-reporter-action v2 for Benchmarks}

AndrewJakubowicz

This is looking great!

packages/labs/react/examples/preact/src/index.tsx

packages/labs/react/examples/preact/tsconfig.json

packages/labs/react/examples/test-elements-react/src/element-a.ts

packages/labs/react/examples/test-elements-react/src/element-events.ts

rollup-common.js

justinfagnani · 2023-08-21T21:41:14Z

@augustjk why packages/labs/react/examples instead of the top-level examples folder we already have?

augustjk · 2023-08-21T21:54:18Z

@augustjk why packages/labs/react/examples instead of the top-level examples folder we already have?

My original thinking was these are specifically for testing labs/react package and should be included under it.

Top level examples folder does not participate in npm workspaces so we can't reference by internal package name, and we don't run any tests against those. Maybe that should change though.

The original intent of not making top level examples not be part of npm workspaces was we didn't want to bloat the monorepo npm install and npm build with all these example projects and their dependencies like next and vite, and to make each example have their own node_modules directory for better isolation. I can be convinced to change top level examples to npm workspace and move the examples there since the goal would be to add tests that run in CI for all examples, so they should be installed anyway and maybe the isolation of node_modules is less of a concern if npm workspace handles versioning properly.

- Combine type export for element-events - Add jsdoc for exported components

packages/labs/compiler/package.json

AndrewJakubowicz

Excellent

examples/preact/index.html

examples/preact/package.json

examples/preact/src/index.tsx

packages/labs/test-projects/test-elements-react/package.json

packages/labs/test-projects/test-elements-react/tsconfig.json

- Fix typo in preact example package name - Omit optional tags in index.html - Make test-elements-react private and add description

augustjk requested review from AndrewJakubowicz, justinfagnani and rictic August 17, 2023 00:59

augustjk requested a review from kevinpschaaf as a code owner August 17, 2023 00:59

augustjk mentioned this pull request Aug 17, 2023

[labs/react] Figure out pattern and/or fix types for using a wrapped component in React and Preact #3289

Closed

1 task

AndrewJakubowicz reviewed Aug 21, 2023

View reviewed changes

augustjk mentioned this pull request Aug 25, 2023

[labs/react] Fix type compatibility with Preact when adding children #4142

Merged

augustjk added 10 commits August 25, 2023 17:26

Add test-elements-react package

c4de961

Add preact example package

5672e3e

Add empty changeset

00bbe18

Add top level examples/ to npm workspace

97d4bb1

Move preact example to top level examples

f2dc134

Move test-elements-react to test-projects

d54c343

Address review feedback for test-elements-react

71e91e2

- Combine type export for element-events - Add jsdoc for exported components

Make nextjs deps looser and fix preact tsconfig

055a3ef

Dedupe packages

66951fc

Add test for children

4490213

augustjk force-pushed the preact-test branch from cfd7a77 to 4490213 Compare August 26, 2023 00:49

augustjk added 3 commits August 25, 2023 17:58

Make compiler match 3.0

4e7d9fc

Undo change to rollup-common.js

c615fa7

Add readme to preact example

381ff09

augustjk requested a review from AndrewJakubowicz August 26, 2023 01:07

Fix typo

5d4890c

augustjk commented Aug 26, 2023

View reviewed changes

packages/labs/compiler/package.json Show resolved Hide resolved

augustjk changed the title ~~[labs/react] Add examples with Preact project type test~~ [examples] Add examples with Preact project type test Aug 26, 2023

augustjk mentioned this pull request Aug 26, 2023

[labs/react] Loosen type for react module in option #4143

Closed

AndrewJakubowicz approved these changes Aug 28, 2023

View reviewed changes

augustjk added 2 commits August 28, 2023 11:04

Address review comments

f2c588d

- Fix typo in preact example package name - Omit optional tags in index.html - Make test-elements-react private and add description

Update package-lock.json

53b40ef

augustjk merged commit 546a338 into main Aug 28, 2023

augustjk deleted the preact-test branch August 28, 2023 20:51

[examples] Add examples with Preact project type test #4111

[examples] Add examples with Preact project type test #4111

Uh oh!

Conversation

augustjk commented Aug 17, 2023 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Changes

Uh oh!

changeset-bot bot commented Aug 17, 2023 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

🦋 Changeset detected

Uh oh!

github-actions bot commented Aug 17, 2023 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

📊 Tachometer Benchmark Results

Summary

nop-update

render

update

update-reflect

Results

render

update

update-reflect

render

update

nop-update

render

update

render

update

update-reflect

Uh oh!

AndrewJakubowicz left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

justinfagnani commented Aug 21, 2023

Uh oh!

augustjk commented Aug 21, 2023

Uh oh!

Uh oh!

AndrewJakubowicz left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

augustjk commented Aug 17, 2023 •

edited

Loading

changeset-bot bot commented Aug 17, 2023 •

edited

Loading

github-actions bot commented Aug 17, 2023 •

edited

Loading