Skip to content

Conversation

@PupilTong
Copy link
Collaborator

@PupilTong PupilTong commented Jul 11, 2025

mark template elements in lynx by using a lynxElementTemplateMarkerAttribute attribute

mark and save part elements in lynx by using a lynxPartIdAttribute

use a querySelectorAll to impl the "get parts"

#52

Summary by CodeRabbit

  • New Features

    • Added support for advanced template element and part identification in the UI framework, enabling enhanced template processing and manipulation.
    • Introduced new internal APIs for marking template elements and parts, as well as retrieving template parts.
  • Bug Fixes

    • Improved handling of child elements to return a static array or null, ensuring more predictable results.
  • Tests

    • Added new tests to verify template marking and part retrieval functionality.
    • Updated test configuration to include additional test categories and support multi-threading scenarios.

…_GetTemplateParts in all-on-ui

mark template elements in lynx by using a lynxElementTemplateMarkerAttribute attribute
mark and save part elements in lynx by using a lynxPartIdAttribute

use a querySelectorAll to impl the "get parts"
@PupilTong PupilTong requested a review from Copilot July 11, 2025 10:51
@coderabbitai
Copy link
Contributor

coderabbitai bot commented Jul 11, 2025

Walkthrough

This change introduces three new internal APIs for template and part marking within the main thread UI context: __MarkTemplateElement, __MarkPartElement, and __GetTemplateParts. Constants and type definitions are updated to support these APIs. Associated tests and configuration are added or modified to validate the new functionality. Additionally, conditional multi-threading support is added in tests and runtime initialization.

Changes

File(s) Change Summary
.changeset/odd-carrots-slide.md Documents the addition of new internal APIs for template/part marking across three packages.
packages/web-platform/web-constants/src/constants.ts Adds two new string constants: lynxElementTemplateMarkerAttribute and lynxPartIdAttribute.
packages/web-platform/web-constants/src/types/Element.ts Extends WebFiberElementImpl interface with optional querySelectorAll method.
packages/web-platform/web-constants/src/types/MainThreadGlobalThis.ts Updates types for new APIs, adjusts optionality and signatures, and adds types for marking elements/parts.
packages/web-platform/web-constants/src/utils/generateTemplate.ts Adds new variable names to mainThreadInjectVars for injection into the main thread.
packages/web-platform/web-mainthread-apis/src/createMainThreadGlobalThis.ts Implements new APIs for marking templates/parts and fetching template parts; updates global context export.
packages/web-platform/web-mainthread-apis/src/pureElementPAPIs.ts Changes __GetChildren to return an array or null instead of a live collection; adds __MarkTemplateElement, __MarkPartElement, and __GetTemplateParts functions.
packages/web-platform/web-tests/playwright.config.ts Updates test pattern to include main-thread-apis category.
packages/web-platform/web-tests/shell-project/mainthread-test.ts Adds conditional multi-threading mode and adjusts initialization logic accordingly.
packages/web-platform/web-tests/tests/main-thread-apis.test.ts Adds a test for new template/part marking APIs; skips test in multi-threaded mode.

Sequence Diagram(s)

sequenceDiagram
    participant Test as Test Suite
    participant MTGlobal as MainThreadGlobalThis
    participant Element as DOM Element

    Test->>MTGlobal: __MarkTemplateElement(Element)
    MTGlobal->>Element: Set 'l-template' attribute

    Test->>MTGlobal: __MarkPartElement(Element, partId)
    MTGlobal->>Element: Set 'l-part' attribute

    Test->>MTGlobal: __GetTemplateParts(templateElement)
    MTGlobal->>Element: querySelectorAll('[l-part]')
    MTGlobal->>Test: Return { partId: Element }
Loading

Suggested reviewers

  • Sherry-hue

Poem

In the warren of code where templates reside,
New APIs mark parts with carrot-like pride.
With a hop and a skip, templates are found,
Each part in its place, neatly marked on the ground.
Now tests nibble gently—success all around!
🥕

Warning

There were issues while running some tools. Please review the errors and either fix the tool's configuration or disable the tool if it's a critical failure.

🔧 ESLint

If the error stems from missing dependencies, add them to the package.json file. For unrecoverable errors (e.g., due to private dependencies), disable the tool in the CodeRabbit configuration.

 ERROR  Cannot resolve version $@rspack/core in overrides. The direct dependencies don't have dependency "@rspack/core".
For help, run: pnpm help install


📜 Recent review details

Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between c7a19c1 and 2a9ea1c.

📒 Files selected for processing (1)
  • packages/web-platform/web-constants/src/utils/generateTemplate.ts (1 hunks)
🚧 Files skipped from review as they are similar to previous changes (1)
  • packages/web-platform/web-constants/src/utils/generateTemplate.ts
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (4)
  • GitHub Check: build / Build (Windows)
  • GitHub Check: build / Build (Ubuntu)
  • GitHub Check: CodeQL Analyze (actions)
  • GitHub Check: CodeQL Analyze (javascript-typescript)
✨ Finishing Touches
  • 📝 Generate Docstrings

🪧 Tips

Chat

There are 3 ways to chat with CodeRabbit:

  • Review comments: Directly reply to a review comment made by CodeRabbit. Example:
    • I pushed a fix in commit <commit_id>, please review it.
    • Explain this complex logic.
    • Open a follow-up GitHub issue for this discussion.
  • Files and specific lines of code (under the "Files changed" tab): Tag @coderabbitai in a new review comment at the desired location with your query. Examples:
    • @coderabbitai explain this code block.
    • @coderabbitai modularize this function.
  • PR comments: Tag @coderabbitai in a new PR comment to ask questions about the PR branch. For the best results, please provide a very specific query, as very limited context is provided in this mode. Examples:
    • @coderabbitai gather interesting stats about this repository and render them as a table. Additionally, render a pie chart showing the language distribution in the codebase.
    • @coderabbitai read src/utils.ts and explain its main purpose.
    • @coderabbitai read the files in the src/scheduler package and generate a class diagram using mermaid and a README in the markdown format.
    • @coderabbitai help me debug CodeRabbit configuration file.

Support

Need help? Create a ticket on our support page for assistance with any issues or questions.

Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments.

CodeRabbit Commands (Invoked using PR comments)

  • @coderabbitai pause to pause the reviews on a PR.
  • @coderabbitai resume to resume the paused reviews.
  • @coderabbitai review to trigger an incremental review. This is useful when automatic reviews are disabled for the repository.
  • @coderabbitai full review to do a full review from scratch and review all the files again.
  • @coderabbitai summary to regenerate the summary of the PR.
  • @coderabbitai generate docstrings to generate docstrings for this PR.
  • @coderabbitai generate sequence diagram to generate a sequence diagram of the changes in this PR.
  • @coderabbitai resolve resolve all the CodeRabbit review comments.
  • @coderabbitai configuration to show the current CodeRabbit configuration for the repository.
  • @coderabbitai help to get help.

Other keywords and placeholders

  • Add @coderabbitai ignore anywhere in the PR description to prevent this PR from being reviewed.
  • Add @coderabbitai summary to generate the high-level summary at a specific location in the PR description.
  • Add @coderabbitai anywhere in the PR title to generate the title automatically.

CodeRabbit Configuration File (.coderabbit.yaml)

  • You can programmatically configure CodeRabbit by adding a .coderabbit.yaml file to the root of your repository.
  • Please see the configuration documentation for more information.
  • If your editor has YAML language server enabled, you can add the path at the top of this file to enable auto-completion and validation: # yaml-language-server: $schema=https://coderabbit.ai/integrations/schema.v2.json

Documentation and Community

  • Visit our Documentation for detailed information on how to use CodeRabbit.
  • Join our Discord Community to get help, request features, and share feedback.
  • Follow us on X/Twitter for updates and announcements.

This comment was marked as outdated.

@changeset-bot
Copy link

changeset-bot bot commented Jul 11, 2025

🦋 Changeset detected

Latest commit: 2a9ea1c

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

This PR includes changesets to release 6 packages
Name Type
@lynx-js/web-mainthread-apis Patch
@lynx-js/web-constants Patch
@lynx-js/web-core Patch
@lynx-js/web-core-server Patch
@lynx-js/web-worker-runtime Patch
@lynx-js/web-worker-rpc Patch

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

@PupilTong PupilTong requested a review from hzy July 11, 2025 10:55
Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

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

Actionable comments posted: 1

🧹 Nitpick comments (2)
.changeset/odd-carrots-slide.md (1)

7-7: Fix the typo in the changeset description.

The feature name contains escaped underscores that make it hard to read.

-feat: support \_\_MarkTemplateElement, \_\_MarkPartElement and \_\_GetTemplateParts for all-on-ui
+feat: support __MarkTemplateElement, __MarkPartElement and __GetTemplateParts for all-on-ui
packages/web-platform/web-constants/src/types/MainThreadGlobalThis.ts (1)

284-285: Fix the typo in the comment.

The comment contains a spelling error that should be corrected.

-  // __GetTemplateParts currently only provied by the thread-strategy = "all-on-ui" (default)
+  // __GetTemplateParts currently only provided by the thread-strategy = "all-on-ui" (default)
📜 Review details

Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 7b75469 and 0750710.

📒 Files selected for processing (10)
  • .changeset/odd-carrots-slide.md (1 hunks)
  • packages/web-platform/web-constants/src/constants.ts (1 hunks)
  • packages/web-platform/web-constants/src/types/Element.ts (1 hunks)
  • packages/web-platform/web-constants/src/types/MainThreadGlobalThis.ts (2 hunks)
  • packages/web-platform/web-constants/src/utils/generateTemplate.ts (1 hunks)
  • packages/web-platform/web-mainthread-apis/src/createMainThreadGlobalThis.ts (4 hunks)
  • packages/web-platform/web-mainthread-apis/src/pureElementPAPIs.ts (1 hunks)
  • packages/web-platform/web-tests/playwright.config.ts (1 hunks)
  • packages/web-platform/web-tests/shell-project/mainthread-test.ts (2 hunks)
  • packages/web-platform/web-tests/tests/main-thread-apis.test.ts (2 hunks)
🧰 Additional context used
🧬 Code Graph Analysis (3)
packages/web-platform/web-tests/shell-project/mainthread-test.ts (3)
packages/web-platform/web-constants/src/types/MainThreadGlobalThis.ts (1)
  • MainThreadGlobalThis (283-368)
packages/web-platform/offscreen-document/src/webworker/OffscreenDocument.ts (3)
  • OffscreenDocument (23-128)
  • operations (17-17)
  • _onEvent (20-20)
packages/web-platform/offscreen-document/src/main/initOffscreenDocument.ts (1)
  • initOffscreenDocument (54-245)
packages/web-platform/web-constants/src/types/MainThreadGlobalThis.ts (1)
packages/web-platform/web-constants/src/types/Element.ts (1)
  • WebFiberElementImpl (51-96)
packages/web-platform/web-mainthread-apis/src/createMainThreadGlobalThis.ts (4)
packages/web-platform/web-constants/src/types/MainThreadGlobalThis.ts (3)
  • GetTemplatePartsPAPI (275-277)
  • MarkTemplateElementPAPI (266-268)
  • MarkPartElementPAPI (270-273)
packages/web-platform/web-constants/src/constants.ts (3)
  • lynxElementTemplateMarkerAttribute (21-21)
  • lynxUniqueIdAttribute (5-5)
  • lynxPartIdAttribute (23-23)
packages/web-platform/web-mainthread-apis/src/pureElementPAPIs.ts (1)
  • __GetElementUniqueID (195-201)
packages/web-platform/web-constants/src/types/Element.ts (1)
  • WebFiberElementImpl (51-96)
🪛 GitHub Check: test-typos
packages/web-platform/web-constants/src/types/MainThreadGlobalThis.ts

[warning] 284-284:
"provied" should be "provide" or "provided" or "proved".

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (5)
  • GitHub Check: build / Build (Ubuntu)
  • GitHub Check: build / Build (Windows)
  • GitHub Check: code-style-check
  • GitHub Check: CodeQL Analyze (actions)
  • GitHub Check: CodeQL Analyze (javascript-typescript)
🔇 Additional comments (17)
packages/web-platform/web-constants/src/types/Element.ts (1)

52-52: Good addition to support template part querying.

The optional querySelectorAll method follows standard DOM API patterns and is appropriately typed. Making it optional allows for flexible implementation across different contexts.

packages/web-platform/web-mainthread-apis/src/pureElementPAPIs.ts (1)

67-67: No breaking change: __GetChildren correctly returns a static array as specified

The GetChildrenPAPI type explicitly returns WebFiberElementImpl[] | null, and all existing consumers (including tests) use array methods like .map and indexing on each call rather than relying on a live HTMLCollection. This implementation aligns with the declared API and test expectations—no further action required.

packages/web-platform/web-tests/playwright.config.ts (1)

23-23: Appropriate test configuration update.

The inclusion of main-thread-apis in the test pattern correctly enables the new template API tests when multi-threading or SSR is enabled.

packages/web-platform/web-constants/src/constants.ts (1)

21-23: Well-named constants for template functionality.

The new attribute constants follow consistent naming patterns and provide clear, descriptive names for marking template elements and parts. The values 'l-template' and 'l-part' are concise and follow the existing lynx attribute naming convention.

packages/web-platform/web-tests/tests/main-thread-apis.test.ts (2)

9-10: Good conditional logic for multi-threading support.

The environment variable check is properly implemented and used consistently throughout the test.


1220-1272: Comprehensive test coverage for the new template APIs.

The test properly exercises all three new APIs (__MarkTemplateElement, __MarkPartElement, and __GetTemplateParts) with a complex nested structure that validates the correct behavior. The test structure effectively simulates real-world usage patterns with nested templates and parts.

The conditional skip for multi-threading is appropriate since these APIs are only available in the "all-on-ui" thread strategy.

packages/web-platform/web-tests/shell-project/mainthread-test.ts (3)

19-20: Consistent environment variable usage.

The ENABLE_MULTI_THREAD constant is properly defined and used consistently throughout the file.


27-45: Well-implemented conditional initialization for multi-threading.

The conditional logic properly handles both multi-threaded and single-threaded modes:

  • Uses OffscreenDocument with callback for multi-threading
  • Falls back to the standard document for single-threading
  • Properly initializes decodeOperation only when needed

The type annotation change from ElementOperation[] to unknown[] is appropriate to accommodate the different operation types.


126-135: Proper conditional DOM setup and safe method calling.

The rootDom assignment correctly chooses between docu and shadowRoot based on the threading mode. The callback implementation safely calls commit and decodeOperation using optional chaining, which prevents runtime errors when these methods are not available.

packages/web-platform/web-mainthread-apis/src/createMainThreadGlobalThis.ts (5)

61-64: Proper import of new constants and types.

The imports for lynxPartIdAttribute, MarkPartElementPAPI, MarkTemplateElementPAPI, and lynxElementTemplateMarkerAttribute are correctly added to support the new template functionality.


150-152: Appropriate type extension for conditional querySelectorAll support.

The rootDom type is correctly extended to optionally include querySelectorAll, which enables the conditional implementation of __GetTemplateParts.


661-685: Robust conditional implementation of __GetTemplateParts.

The implementation correctly:

  • Checks for querySelectorAll availability before defining the function
  • Validates that the element is marked as a template
  • Uses a sophisticated CSS selector to find parts within the template while excluding nested template parts
  • Returns an empty object for non-template elements
  • Maps part IDs to their corresponding elements

The CSS selector logic [${lynxUniqueIdAttribute}="${templateUniqueId}"] [${lynxPartIdAttribute}]:not([${lynxUniqueIdAttribute}="${templateUniqueId}"] [${lynxElementTemplateMarkerAttribute}] [${lynxPartIdAttribute}]) is complex but correct—it finds parts within the template while excluding parts that belong to nested templates.


687-698: Simple and correct implementations of marking APIs.

Both __MarkTemplateElement and __MarkPartElement are straightforward implementations that properly set the required attributes using the imported constants.


707-709: Proper integration of new APIs into the global object.

The new APIs are correctly added to the MainThreadGlobalThis object, with __GetTemplateParts being conditionally included based on availability.

packages/web-platform/web-constants/src/types/MainThreadGlobalThis.ts (3)

65-65: Correct type update for GetChildrenPAPI.

The return type is appropriately updated to allow null in addition to the array, which aligns with the implementation changes.


266-277: Well-defined types for the new template APIs.

The type definitions for MarkTemplateElementPAPI, MarkPartElementPAPI, and GetTemplatePartsPAPI are properly structured with appropriate parameter types and return types.


285-288: Correct interface updates for the new APIs.

The interface properly reflects the new APIs:

  • __GetTemplateParts is optional as it's only available in certain thread strategies
  • __MarkPartElement and __MarkTemplateElement are required properties
  • The positioning and documentation are appropriate

Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

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

Actionable comments posted: 1

📜 Review details

Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 1e232e9 and 0076bc9.

📒 Files selected for processing (2)
  • packages/web-platform/web-mainthread-apis/src/createMainThreadGlobalThis.ts (3 hunks)
  • packages/web-platform/web-mainthread-apis/src/pureElementPAPIs.ts (5 hunks)
🚧 Files skipped from review as they are similar to previous changes (1)
  • packages/web-platform/web-mainthread-apis/src/createMainThreadGlobalThis.ts
🧰 Additional context used
🧬 Code Graph Analysis (1)
packages/web-platform/web-mainthread-apis/src/pureElementPAPIs.ts (3)
packages/web-platform/web-constants/src/types/MainThreadGlobalThis.ts (3)
  • GetTemplatePartsPAPI (275-277)
  • MarkTemplateElementPAPI (266-268)
  • MarkPartElementPAPI (270-273)
packages/web-platform/web-constants/src/constants.ts (3)
  • lynxElementTemplateMarkerAttribute (21-21)
  • lynxUniqueIdAttribute (5-5)
  • lynxPartIdAttribute (23-23)
packages/web-platform/web-constants/src/types/Element.ts (1)
  • WebFiberElementImpl (51-96)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (5)
  • GitHub Check: build / Build (Windows)
  • GitHub Check: code-style-check
  • GitHub Check: CodeQL Analyze (actions)
  • GitHub Check: zizmor
  • GitHub Check: CodeQL Analyze (javascript-typescript)
🔇 Additional comments (4)
packages/web-platform/web-mainthread-apis/src/pureElementPAPIs.ts (4)

10-11: LGTM! New imports are correctly added.

The imports for the new constants and types are properly structured and align with the template marking functionality being introduced.

Also applies to: 32-32, 35-36, 48-48


352-356: LGTM! Template marking function is correctly implemented.

The function properly sets the template marker attribute as expected.


358-363: LGTM! Part marking function is correctly implemented.

The function properly sets the part ID attribute with the provided value.


73-73: No breaking change in __GetChildren – return type is already defined as an array
The GetChildrenPAPI signature in packages/web-platform/web-constants/src/types/MainThreadGlobalThis.ts specifies WebFiberElementImpl[] | null, and all existing consumers (including tests in web-tests) call methods like .map directly on the result. This static-array implementation aligns with the PAPI type and existing usage; no code depends on a live HTMLCollection.
No updates are required.

@codspeed-hq
Copy link

codspeed-hq bot commented Jul 11, 2025

CodSpeed Performance Report

Merging #1275 will not alter performance

Comparing PupilTong:p/hw/mark_template_and_get_parts (2a9ea1c) with main (66f03c1)

Summary

✅ 10 untouched benchmarks

@relativeci
Copy link

relativeci bot commented Jul 11, 2025

Web Explorer

#2875 Bundle Size — 303.58KiB (+0.17%).

2a9ea1c(current) vs e59138b main#2874(baseline)

Bundle metrics  Change 3 changes Regression 1 regression
                 Current
#2875
     Baseline
#2874
Regression  Initial JS 139.97KiB(+0.08%) 139.86KiB
No change  Initial CSS 31.88KiB 31.88KiB
Change  Cache Invalidation 72.69% 0%
No change  Chunks 4 4
No change  Assets 5 5
No change  Modules 205 205
No change  Duplicate Modules 17 17
Change  Duplicate Code 4.23%(+0.71%) 4.2%
No change  Packages 3 3
No change  Duplicate Packages 0 0
Bundle size by type  Change 1 change Regression 1 regression
                 Current
#2875
     Baseline
#2874
Regression  JS 220.81KiB (+0.24%) 220.29KiB
No change  Other 50.89KiB 50.89KiB
No change  CSS 31.88KiB 31.88KiB

Bundle analysis reportBranch PupilTong:p/hw/mark_template_and...Project dashboard


Generated by RelativeCIDocumentationReport issue

@relativeci
Copy link

relativeci bot commented Jul 11, 2025

React Example

#2884 Bundle Size — 234.12KiB (0%).

2a9ea1c(current) vs e59138b main#2883(baseline)

Bundle metrics  no changes
                 Current
#2884
     Baseline
#2883
No change  Initial JS 0B 0B
No change  Initial CSS 0B 0B
No change  Cache Invalidation 0% 0%
No change  Chunks 0 0
No change  Assets 4 4
No change  Modules 153 153
No change  Duplicate Modules 61 61
No change  Duplicate Code 45.85% 45.85%
No change  Packages 2 2
No change  Duplicate Packages 0 0
Bundle size by type  no changes
                 Current
#2884
     Baseline
#2883
No change  IMG 145.76KiB 145.76KiB
No change  Other 88.37KiB 88.37KiB

Bundle analysis reportBranch PupilTong:p/hw/mark_template_and...Project dashboard


Generated by RelativeCIDocumentationReport issue

@PupilTong PupilTong requested a review from Copilot July 14, 2025 05:56
Copy link
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

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

Pull Request Overview

This PR adds support for marking template and part elements and retrieving template parts in the all-on-ui runtime.

  • Introduces __MarkTemplateElement, __MarkPartElement, and __GetTemplateParts APIs.
  • Updates runtime injection, type definitions, and constants to support new template/part handling.
  • Adds tests and configuration updates for the new main-thread APIs.

Reviewed Changes

Copilot reviewed 10 out of 10 changed files in this pull request and generated 2 comments.

Show a summary per file
File Description
packages/web-platform/web-tests/tests/main-thread-apis.test.ts Add multi-thread flag and new test for __MarkTemplateElement and __GetTemplateParts
packages/web-platform/web-tests/shell-project/mainthread-test.ts Refactor multi-thread logic for OffscreenDocument and decodeOperation
packages/web-platform/web-tests/playwright.config.ts Include main-thread-apis tests in Playwright configuration
packages/web-platform/web-mainthread-apis/src/pureElementPAPIs.ts Implement __GetTemplateParts, __MarkTemplateElement, __MarkPartElement; update __GetChildren
packages/web-platform/web-mainthread-apis/src/createMainThreadGlobalThis.ts Conditionally inject new template/part APIs and remove stub
packages/web-platform/web-constants/src/utils/generateTemplate.ts Add __GetTemplateParts, __MarkPartElement, and __MarkTemplateElement to injection
packages/web-platform/web-constants/src/types/MainThreadGlobalThis.ts Define new template/part API types and mark __GetTemplateParts optional
packages/web-platform/web-constants/src/types/Element.ts Add optional querySelectorAll on WebFiberElementImpl
packages/web-platform/web-constants/src/constants.ts Define lynxElementTemplateMarkerAttribute and lynxPartIdAttribute constants
.changeset/odd-carrots-slide.md Bump package versions for new template/part APIs
Comments suppressed due to low confidence (2)

packages/web-platform/web-tests/tests/main-thread-apis.test.ts:1221

  • [nitpick] The test name is less descriptive and uses underscores. Consider renaming it to a more human-readable description like "mark template elements and retrieve template parts" to match other test naming conventions.
    '__MarkTemplate_and_Get_Parts',

packages/web-platform/web-tests/shell-project/mainthread-test.ts:27

  • Using unknown[] loses type information for operations. Revert to ElementOperation[] (or a more specific type) to maintain type safety.
let elementOperations: unknown[] = [];

@Sherry-hue Sherry-hue added this pull request to the merge queue Jul 14, 2025
@github-merge-queue github-merge-queue bot removed this pull request from the merge queue due to failed status checks Jul 14, 2025
@PupilTong PupilTong added this pull request to the merge queue Jul 14, 2025
Merged via the queue into lynx-family:main with commit 5062128 Jul 14, 2025
43 checks passed
@PupilTong PupilTong deleted the p/hw/mark_template_and_get_parts branch July 14, 2025 08:22
colinaaa pushed a commit that referenced this pull request Jul 19, 2025
This PR was opened by the [Changesets
release](https://github.com/changesets/action) GitHub action. When
you're ready to do a release, you can merge this and the packages will
be published to npm automatically. If you're not ready to do a release
yet, that's fine, whenever you add more changesets to main, this PR will
be updated.


# Releases
## @lynx-js/[email protected]

### Patch Changes

- Optimize `componentAtIndex` by a few hundreds microseconds: avoiding
manipulate `__pendingListUpdates` unless SnapshotInstance tree is
changed ([#1201](#1201))

- Support alog of component rendering on production for better error
reporting. Enable it by using `REACT_ALOG=true rspeedy dev/build` or
defining `__ALOG__` to `true` in `lynx.config.js`:
([#1164](#1164))

    ```js
    export default defineConfig({
      // ...
      source: {
        define: {
          __ALOG__: true,
        },
      },
    });
    ```

- Make `preact/debug` work with `@lynx-js/react`.
([#1222](#1222))

- Introduce `@lynx-js/react/debug` which would include debugging
warnings and error messages for common mistakes found.
([#1250](#1250))

Add the import to `@lynx-js/react/debug` at the first line of the entry:

    ```js
    import "@lynx-js/react/debug";
    import { root } from "@lynx-js/react";

    import { App } from "./App.jsx";

    root.render(<App />);
    ```

- `<list-item/>` deferred now accepts an object with `unmountRecycled`
property to control unmounting behavior when the item is recycled.
([#1302](#1302))

    For example, you can use it like this:

    ```jsx
    <list-item defer={{ unmountRecycled: true }} item-key="1">
      <WillBeUnmountIfRecycled />
    </list-item>
    ```

Now the component will be unmounted when it is recycled, which can help
with performance in certain scenarios.

- Avoid some unexpected `__SetAttribute` in hydrate when `undefined` is
passed as an attribute value to intrinsic elements, for example:
([#1318](#1318))

    ```jsx
    <image async-mode={undefined} />
    ```

## @lynx-js/[email protected]

### Patch Changes

- Bump Rsbuild v1.4.6 with Rspack v1.4.8.
([#1282](#1282))

## [email protected]

### Patch Changes

- Add `import '@lynx-js/react/debug'` for all templates.
([#1250](#1250))

## @lynx-js/[email protected]

### Patch Changes

- Fix "TypeError: cannot read property 'call' of undefined" error during
HMR updates.
([#1304](#1304))

- Supports extractStr for large JSON
([#1230](#1230))

- Change `extractStr` to `false` when `performance.chunkSplit.strategy`
is not `all-in-one`.
([#1251](#1251))

- Updated dependencies
\[[`cb7feb6`](cb7feb6),
[`ec7228f`](ec7228f)]:
    -   @lynx-js/[email protected]
    -   @lynx-js/[email protected]
    -   @lynx-js/[email protected]
    -   @lynx-js/[email protected]
    -   @lynx-js/[email protected]
    -   @lynx-js/[email protected]

## @lynx-js/[email protected]

### Patch Changes

- Support `@lynx-js/react/debug`.
([#1250](#1250))

## @lynx-js/[email protected]

### Patch Changes

- Support alog of component rendering on production for better error
reporting. Enable it by using `REACT_ALOG=true rspeedy dev/build` or
defining `__ALOG__` to `true` in `lynx.config.js`:
([#1164](#1164))

    ```js
    export default defineConfig({
      // ...
      source: {
        define: {
          __ALOG__: true,
        },
      },
    });
    ```

- Supports `console.alog` and use different `console` object in main
thread and background thread.
([#1164](#1164))

## @lynx-js/[email protected]

### Patch Changes

- feat: move SSR hydrate essential info to the ssr attribute
([#1292](#1292))

We found that in browser there is no simple tool to decode a base64
string

    Therefore we move the data to `ssr` attribute

    Also fix some ssr issues

- feat: support \_\_MarkTemplateElement, \_\_MarkPartElement and
\_\_GetTemplateParts for all-on-ui
([#1275](#1275))

-   Updated dependencies \[]:
    -   @lynx-js/[email protected]

## @lynx-js/[email protected]

### Patch Changes

- feat: support SSR for all-on-ui
([#1029](#1029))

- feat: move SSR hydrate essential info to the ssr attribute
([#1292](#1292))

We found that in browser there is no simple tool to decode a base64
string

    Therefore we move the data to `ssr` attribute

    Also fix some ssr issues

- feat: support \_\_MarkTemplateElement, \_\_MarkPartElement and
\_\_GetTemplateParts for all-on-ui
([#1275](#1275))

- feat: mark template elements for SSR and update part ID handling
([#1286](#1286))

- Updated dependencies
\[[`cebda59`](cebda59),
[`1443e46`](1443e46),
[`5062128`](5062128),
[`f656b7f`](f656b7f)]:
    -   @lynx-js/[email protected]
    -   @lynx-js/[email protected]
    -   @lynx-js/[email protected]
    -   @lynx-js/[email protected]

## @lynx-js/[email protected]

### Patch Changes

- feat: support SSR for all-on-ui
([#1029](#1029))

- feat: move SSR hydrate essential info to the ssr attribute
([#1292](#1292))

We found that in browser there is no simple tool to decode a base64
string

    Therefore we move the data to `ssr` attribute

    Also fix some ssr issues

- feat: dump the event info on ssr stage
([#1237](#1237))

- feat: mark template elements for SSR and update part ID handling
([#1286](#1286))

## @lynx-js/[email protected]

### Patch Changes

- fix: indicator dots' bg-color on safari 26
([#1298](#1298))

    <https://bugs.webkit.org/show_bug.cgi?id=296048>
    The animation name should be defined in the template

- fix: list may only render only one column in ReactLynx.
([#1280](#1280))

This is because `span-count` may not be specified when `list-type` is
specified, resulting in layout according to `span-count="1"`. Postponing
the acquisition of `span-count` until layoutListItem can solve this
problem.

- Updated dependencies
\[[`443f3d5`](443f3d5)]:
    -   @lynx-js/[email protected]

## @lynx-js/[email protected]

### Patch Changes

- fix: indicator dots' bg-color on safari 26
([#1298](#1298))

    <https://bugs.webkit.org/show_bug.cgi?id=296048>
    The animation name should be defined in the template

## @lynx-js/[email protected]

### Patch Changes

- feat: support SSR for all-on-ui
([#1029](#1029))

- feat: move SSR hydrate essential info to the ssr attribute
([#1292](#1292))

We found that in browser there is no simple tool to decode a base64
string

    Therefore we move the data to `ssr` attribute

    Also fix some ssr issues

- feat: support \_\_MarkTemplateElement, \_\_MarkPartElement and
\_\_GetTemplateParts for all-on-ui
([#1275](#1275))

- feat: mark template elements for SSR and update part ID handling
([#1286](#1286))

- Updated dependencies
\[[`1443e46`](1443e46),
[`5062128`](5062128)]:
    -   @lynx-js/[email protected]

## @lynx-js/[email protected]

### Patch Changes

- Updated dependencies
\[[`cebda59`](cebda59),
[`1443e46`](1443e46),
[`5062128`](5062128),
[`f656b7f`](f656b7f)]:
    -   @lynx-js/[email protected]
    -   @lynx-js/[email protected]
    -   @lynx-js/[email protected]

## @lynx-js/[email protected]

### Patch Changes

- Fix the `Syntax Error: expecting ';'` error of chunk splitting
([#1279](#1279))

## [email protected]



## @lynx-js/[email protected]

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
@coderabbitai coderabbitai bot mentioned this pull request Aug 27, 2025
3 tasks
@PupilTong PupilTong mentioned this pull request Sep 22, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

Status: Done

Development

Successfully merging this pull request may close these issues.

2 participants