Skip to content

feat: intergrate the LinearContainer Compat plugin#2100

Merged
PupilTong merged 2 commits intolynx-family:mainfrom
PupilTong:p/hw/interigrate-web-elements-compat-pkg
Jan 8, 2026
Merged

feat: intergrate the LinearContainer Compat plugin#2100
PupilTong merged 2 commits intolynx-family:mainfrom
PupilTong:p/hw/interigrate-web-elements-compat-pkg

Conversation

@PupilTong
Copy link
Copy Markdown
Collaborator

@PupilTong PupilTong commented Jan 8, 2026

This is a BREAKING CHANGE

Not we intergrated the LinearCompat in the @lynx-js/web-elements. Developers could safely remove the following imports:

import '@lynx-js/web-elements/compat/LinearContainer';
import '@lynx-js/web-elements-compat/LinearContainer';

Summary by CodeRabbit

  • Breaking Changes

    • LinearContainer compatibility plugin integrated; legacy LinearContainer compatibility imports removed — update usages accordingly.
  • New Features

    • Components expose explicit event enable/disable controls.
    • LinearContainer support composed into multiple UI components.
  • Improvements

    • CSS imports reorganized and consolidated for simpler consumption.
    • Tests and fixtures updated for single-thread execution and event handling stability.
  • Tests

    • New component event tests and fixtures added to validate event enable/disable behavior.

✏️ Tip: You can customize this high-level summary in your review settings.

Checklist

  • Tests updated (or not required).
  • Documentation updated (or not required).
  • Changeset added, and when a BREAKING CHANGE occurs, it needs to be clearly marked (or not required).

@changeset-bot
Copy link
Copy Markdown

changeset-bot Bot commented Jan 8, 2026

🦋 Changeset detected

Latest commit: 0cabea7

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

This PR includes changesets to release 1 package
Name Type
@lynx-js/web-elements Minor

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 self-assigned this Jan 8, 2026
@coderabbitai
Copy link
Copy Markdown
Contributor

coderabbitai Bot commented Jan 8, 2026

📝 Walkthrough

Walkthrough

Integrates the LinearContainer compat plugin and conditionally exports it, reorganizes CSS imports to per-element files, removes legacy linear CSS and some package exports, refactors Component event handling, adds event tests/fixtures, and updates E2E tests to single-thread mode while removing swipe/drag utilities.

Changes

Cohort / File(s) Summary
Changeset & Release Note
\.changeset/wide-views-admire.md
New changeset: minor bump and BREAKING CHANGE notice about LinearContainer compat integration and deprecated import removal.
CSS import reorg & removal
packages/web-platform/web-elements/elements.css, packages/web-platform/web-elements/index.css, packages/web-platform/web-core-wasm/css/in_shadow.css, packages/web-platform/web-core-wasm/css/linear.css
Removed consolidated elements.css; added per-element imports in index.css; linear.css content deleted (linear layout rules removed); shadow CSS now imports index.css.
LinearContainer implementation & compat CSS
packages/web-platform/web-elements/src/compat/LinearContainer/LinearContainer.ts, .../linear-compat.css, packages/web-platform/web-elements/src/compat/index.ts
LinearContainer class made internal (LinearContainerImpl) and exported as conditional const LinearContainer; compat CSS selectors consolidated; re-export added in compat index.
Component decorator & event API
packages/web-platform/web-elements/src/element-reactive/component.ts
Parameter renamed to accept optional reactive classes and undefineds filtered; event lifecycle refactored to explicit enableEvent(eventName) / disableEvent(eventName) methods; add/remove listener paths adapted.
Component metadata updates (LinearContainer added)
packages/web-platform/web-elements/src/elements/*
.../ScrollView/ScrollView.ts, .../XFoldViewNg/..., .../XRefreshView/..., .../XSwiper/SwiperItem.ts, .../XView/XView.ts, .../XViewpagerNg/...
Imported LinearContainer and inserted it into component @Component(...) metadata arrays across ~16 component files (decorator composition only).
Package exports cleanup
packages/web-platform/web-elements/package.json
Removed public export entries: ./elements.css, ./compat/LinearContainer, and ./compat/LinearContainer/linear-compat.css.
E2E test changes & util removal
packages/web-platform/web-core-wasm-e2e/tests/utils.ts, packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
Deleted utils.ts (removed swipe/dragAndHold helpers). Tests refactored from multi-thread worker paths to single-thread page.evaluate flows; tightened getBackgroundThreadWorker signature; adjusted waits and assertions.
New event tests & fixtures
packages/web-platform/web-elements/tests/component-event.spec.ts, packages/web-platform/web-elements/tests/fixtures/component-event-test.html, packages/web-platform/web-elements/tests/fixtures/shell-project.ts
New fixture registering x-event-test, exposes Component/register handler to global, and adds tests for enable/disable event flows and add/remove listener behavior.
Test import cleanup
packages/web-platform/web-tests/shell-project/lynx-view.ts, packages/web-platform/web-tests/shell-project/web-core.ts, packages/web-platform/web-elements/src/elements/common-css/linear.css
Removed legacy @lynx-js/web-elements/compat/LinearContainer imports from test shell files and removed a compatibility comment in linear.css.

Estimated code review effort

🎯 4 (Complex) | ⏱️ ~50 minutes

Possibly related PRs

Suggested reviewers

  • Sherry-hue
  • colinaaa
  • Yradex

Poem

🐰 A rabbit nibbles through stylesheet trails,

LinearContainer tucked into component veils.
Tests now single-threaded, utilities gone,
Events enabled, then quietly withdrawn.
Hops of refactor — a small, tidy dawn.

🚥 Pre-merge checks | ✅ 2 | ❌ 1
❌ Failed checks (1 warning)
Check name Status Explanation Resolution
Docstring Coverage ⚠️ Warning Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%. Write docstrings for the functions missing them to satisfy the coverage threshold.
✅ Passed checks (2 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check ✅ Passed The title 'feat: intergrate the LinearContainer Compat plugin' directly relates to the main change: integrating LinearContainer into web-elements, though it contains a typo ('intergrate' should be 'integrate').

✏️ Tip: You can configure your own custom pre-merge checks in the settings.


Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands and usage tips.

Copy link
Copy Markdown
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: 3

Caution

Some comments are outside the diff and can’t be posted inline due to platform limitations.

⚠️ Outside diff range comments (2)
packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts (1)

368-397: Variable scoping bug: success is not shared between contexts.

The success variable declared on line 372 exists in the Node.js test context, but the event listener on line 379 runs in the browser context where success is undefined. The assignment success = true creates/modifies a different variable in the browser's global scope. Lines 393-395 try to read this browser-global success, which was never declared with let.

🐛 Proposed fix using window property
   test('event-i18n-resources-missed', async ({ page, browserName }) => {
     // firefox dose not support this.
     test.skip(browserName === 'firefox');
     await goto(page);
-    let success = false;
     await page.evaluate(() => {
+      (window as any).i18nTestSuccess = false;
       (document.querySelector('lynx-view') as LynxViewElement).addEventListener(
         'i18nResourceMissed',
         (event) => {
           // @ts-expect-error
           if (event.detail.channel === '2') {
-            success = true;
+            (window as any).i18nTestSuccess = true;
           }
         },
       );
     });
     await page.evaluate(() => {
       globalThis.runtime.renderPage = () => {};
       globalThis.runtime._I18nResourceTranslation({
         locale: 'en',
         channel: '2',
         fallback_url: '',
       });
     });
     await wait(500);
-    success = await page.evaluate<boolean>(() => {
-      return success;
-    });
+    const success = await page.evaluate<boolean>(() => {
+      return (window as any).i18nTestSuccess;
+    });
     expect(success).toBeTruthy();
   });
packages/web-platform/web-elements/src/element-reactive/component.ts (1)

327-345: Listener count not decremented when > 1, causing count drift.

When currentListenerCount > 1, the code does nothing—the WeakMap value is never decremented, and disableEvent is never called. This creates a count mismatch:

  1. addEventListener('click', fn) → count=1, WeakMap: fn→1
  2. addEventListener('click', fn) → count=2, WeakMap: fn→2
  3. removeEventListener('click', fn) → currentListenerCount=2, no decrement, count stays 2
  4. Subsequent removes also do nothing

The count will only decrease when currentListenerCount === 1, but it can never reach 1 if it was incremented past that.

Proposed fix
      override removeEventListener(
        type: string,
        listener: EventListener,
        options?: AddEventListenerOptions | boolean,
      ): void {
        super.removeEventListener(type, listener, options);
        const capture = typeof options === 'object' ? options.capture : options;
        const targetEventInfo = this.#eventListenerMap[type];
        if (targetEventInfo && targetEventInfo.count > 0) {
          const targetMap = capture
            ? targetEventInfo.captureListenerCount
            : targetEventInfo.listenerCount;
          const currentListenerCount = targetMap.get(listener);
-          if (currentListenerCount === 1) {
-            targetMap.delete(listener);
-            this.disableEvent(type);
+          if (currentListenerCount !== undefined) {
+            if (currentListenerCount === 1) {
+              targetMap.delete(listener);
+            } else {
+              targetMap.set(listener, currentListenerCount - 1);
+            }
+            this.disableEvent(type);
          }
        }
      }
🤖 Fix all issues with AI agents
In @.changeset/wide-views-admire.md:
- Line 9: The sentence in the changeset has grammar and spelling mistakes and an
inconsistent component name: replace "Not we intergrated the `LinearCompat` in
the @lynx-js/web-elements. Developers could safely remove the following
imports:" with a corrected version such as "Now we integrated the
`LinearContainer` into `@lynx-js/web-elements`. Developers can safely remove the
following imports:" — correct "Not" → "Now", "intergrated" → "integrated",
update `LinearCompat` → `LinearContainer` for consistency, and change "could" →
"can" for present-tense clarity.
- Line 5: Replace the misspelled word in the changelog header: update the entry
"feat: intergrate the LinearContainer Compat plugin" by changing "intergrate" to
"integrate" so it reads "feat: integrate the LinearContainer Compat plugin".

In
@packages/web-platform/web-elements/src/compat/LinearContainer/linear-compat.css:
- Around line 104-123: The selectors for the vertical and horizontal reverse
cases are missing the child combinator and currently apply align-self to the
container rather than its children; update the selectors so every option targets
children consistently (e.g., change
[lynx-computed-display="linear"][lynx-linear-orientation="vertical-reverse"] to
[lynx-computed-display="linear"][lynx-linear-orientation="vertical-reverse"] > *
and likewise change
[lynx-computed-display="linear"][lynx-linear-orientation="horizontal-reverse"]
to
[lynx-computed-display="linear"][lynx-linear-orientation="horizontal-reverse"] >
*) so that align-self: var(--align-self-column) and align-self:
var(--align-self-row) apply to child elements (including the lynx-wrapper > *
variants) rather than the container.
🧹 Nitpick comments (2)
packages/web-platform/web-elements/tests/fixtures/component-event-test.html (1)

14-74: Remove exploratory dead code.

Lines 14-74 contain unused classes (EventTracker, EventTrackerImpl) and lengthy inline comments explaining decorator mechanics. While helpful during development, this adds noise to the test fixture. Consider removing or moving to a separate documentation file.

♻️ Simplified fixture without exploratory code
     const { Component, registerEventEnableStatusChangeHandler } =
         globalThis;

-      class EventTracker {
-        static observedAttributes = [];
-      }
-      // Apply decorator manually since we are in potentially non-transpiled JS or simpler env
-      // But decorators usually need transpilation.
-      // Actually, since this is running in browser via simple script tag, we can't use TS decorators directly unless we use the return value of registerEventEnableStatusChangeHandler as a function wrapper if it supports it, OR we just use the prototype manipulation if the decorator helper is available.
-      // Wait, the previous code used TS decorators.
-      // `registerEventEnableStatusChangeHandler` is a function that returns a decorator.
-
-      // Let's check how registerEventEnableStatusChangeHandler is implemented.
-      // distinct from the TS decorator, we might need to apply it manually.
-
-      // Let's implement it in a way that works in browser JS (if the build supports it).
-      // Since main.js is built from shell-project.ts which includes the libs.
-
-      // The decorator implementation:
-      // export const registerEventEnableStatusChangeHandler = generateRegister<...>(...);
-      // generateRegister returns a decorator function (target, context) => ...
-
-      // In TS 5.0 decorators are functions. In legacy experiment decorators they are also functions.
-
-      // However, writing raw ES classes in HTML script tag means no TS compilation.
-      // We can simulate what the decorator does or just define the reactive class structure manually if we know it.
-
-      // Looking at `component.ts`:
-      // `Component` takes (tag, attributeReactiveClassesOptional, template).
-      // `AttributeReactiveClass` expects `observedAttributes`, `eventStatusChangedHandler` etc.
-
-      // So we can define the class directly without decorators if we construct the metadata manually.
-
-      class EventTrackerImpl {
-        static observedAttributes = [];
-        static eventStatusChangedHandler = {
-          'custom-event': function(status, type) {
-            if (!window.eventEvents) {
-              window.eventEvents = [];
-            }
-            window.eventEvents.push({ type, status });
-          },
-        };
-      }
-
-      // Logic from `registerEventStatusChangedHandler.ts` -> `generateRegister`
-      // It basically registers the handler to a static `eventStatusChangedHandler` map or similar?
-      // Actually `generateRegister` creates a method decorator.
-
-      // If we look at `component.ts`:
-      // export type AttributeReactiveObject = {
-      //   eventStatusChangedHandler?: Record<string, EventStatusChangeHandler>;
-      // ...
-      // }
-
-      // And `Component` uses `new oneClass(this)`.
-
-      // So the instances of `EventTracker` need to have `eventStatusChangedHandler`.
-      // Or the class `EventTracker` needs to have the static metadata if `Component` reads it from static?
-
-      // `component.ts`:
-      // 296: const handler = oneReactive.eventStatusChangedHandler?.[type];
-
-      // So `oneReactive` (instance of AttributeReactiveClass) must have `eventStatusChangedHandler` property.
-
+      // EventTrackerManual provides the eventStatusChangedHandler for testing
+      // event enable/disable status tracking
       class EventTrackerManual {
packages/web-platform/web-elements/tests/component-event.spec.ts (1)

3-8: Use proper Playwright Page type instead of any.

The page parameter is typed as any, losing type safety. Import and use the Page type from Playwright.

♻️ Proposed fix
 import { test, expect } from '@lynx-js/playwright-fixtures';
+import type { Page } from '@playwright/test';

-const gotoWebComponentPage = async (page: any, testname: string) => {
+const gotoWebComponentPage = async (page: Page, testname: string) => {
   await page.goto(`/tests/fixtures/${testname}.html`, {
     waitUntil: 'load',
   });
   await page.evaluate(() => document.fonts.ready);
 };

@PupilTong PupilTong force-pushed the p/hw/interigrate-web-elements-compat-pkg branch from ecf66fa to 522d08e Compare January 8, 2026 10:39
Copy link
Copy Markdown
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: 4

Caution

Some comments are outside the diff and can’t be posted inline due to platform limitations.

⚠️ Outside diff range comments (2)
packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts (1)

368-397: Bug: success variable scope issue in page context.

There's a variable scoping issue in this test:

  1. success is declared in the test context (line 372)
  2. In page.evaluate at line 373, success is captured but assigning to it inside the callback won't update the outer variable
  3. At lines 393-395, page.evaluate<boolean>(() => { return success; }) tries to read success from the page context, but it doesn't exist there

This test will always fail or throw a ReferenceError.

🐛 Suggested fix using page-level variable
   test('event-i18n-resources-missed', async ({ page, browserName }) => {
     // firefox dose not support this.
     test.skip(browserName === 'firefox');
     await goto(page);
-    let success = false;
     await page.evaluate(() => {
+      (window as any).__testSuccess = false;
       (document.querySelector('lynx-view') as LynxViewElement).addEventListener(
         'i18nResourceMissed',
         (event) => {
           // @ts-expect-error
           if (event.detail.channel === '2') {
-            success = true;
+            (window as any).__testSuccess = true;
           }
         },
       );
     });
     await page.evaluate(() => {
       globalThis.runtime.renderPage = () => {};
       globalThis.runtime._I18nResourceTranslation({
         locale: 'en',
         channel: '2',
         fallback_url: '',
       });
     });
     await wait(500);
-    success = await page.evaluate<boolean>(() => {
-      return success;
-    });
+    const success = await page.evaluate<boolean>(() => {
+      return (window as any).__testSuccess;
+    });
     expect(success).toBeTruthy();
   });
packages/web-platform/web-elements/src/element-reactive/component.ts (1)

311-345: Fix critical event listener counting mismatch.

The current implementation has a logic error in removeEventListener that breaks the symmetry with addEventListener:

The bug:

  • addEventListener always calls enableEvent (incrementing the global count) and always increments the per-listener count
  • removeEventListener only calls disableEvent when currentListenerCount === 1, and never decrements the per-listener count otherwise

Impact:
This causes a counting mismatch where if the same listener is added twice:

  1. Global count becomes 2, per-listener count becomes 2
  2. First removal: per-listener count is 2 (not 1), so disableEvent is not called
  3. Second removal: per-listener count is still 2 (never decremented), so disableEvent is still not called
  4. Result: eventStatusChangedHandler never gets called with false, event tracking is never disabled, and memory leaks occur
🐛 Proposed fix for the counting logic
 override removeEventListener(
   type: string,
   listener: EventListener,
   options?: AddEventListenerOptions | boolean,
 ): void {
   super.removeEventListener(type, listener, options);
   const capture = typeof options === 'object' ? options.capture : options;
   const targetEventInfo = this.#eventListenerMap[type];
   if (targetEventInfo && targetEventInfo.count > 0) {
     const targetMap = capture
       ? targetEventInfo.captureListenerCount
       : targetEventInfo.listenerCount;
     const currentListenerCount = targetMap.get(listener);
-    if (currentListenerCount === 1) {
+    if (currentListenerCount && currentListenerCount > 0) {
+      if (currentListenerCount === 1) {
+        targetMap.delete(listener);
+      } else {
+        targetMap.set(listener, currentListenerCount - 1);
+      }
-      targetMap.delete(listener);
       this.disableEvent(type);
+    }
   }
 }

This fix ensures:

  1. Per-listener count is always decremented when > 1
  2. disableEvent is called for every removeEventListener, balancing the enableEvent calls from addEventListener
🤖 Fix all issues with AI agents
In @.changeset/wide-views-admire.md:
- Line 5: Correct the spelling in the changeset title: replace the word
"intergrate" with "integrate" in the line that currently reads "feat: intergrate
the LinearContainer Compat plugin" so it becomes "feat: integrate the
LinearContainer Compat plugin".
- Line 9: Fix the grammar on the sentence that currently reads "Not we
intergrated the `LinearCompat` in the @lynx-js/web-elements. Developers could
safely remove the following imports:" by replacing it with a corrected version
such as "Now we integrated the `LinearCompat` into @lynx-js/web-elements.
Developers can safely remove the following imports:" — update the text in
.changeset/wide-views-admire.md where that string appears, correcting
"Not"→"Now", "intergrated"→"integrated", "in"→"into", and "could"→"can".

In
@packages/web-platform/web-elements/src/compat/LinearContainer/linear-compat.css:
- Around line 104-123: The CSS selectors for reverse orientations are missing
the child combinator and thus target the container instead of its children;
update the selectors
[lynx-computed-display="linear"][lynx-linear-orientation="vertical-reverse"] and
[lynx-computed-display="linear"][lynx-linear-orientation="horizontal-reverse"]
to include " > *" (i.e., change them to
[lynx-computed-display="linear"][lynx-linear-orientation="vertical-reverse"] >
*, and
[lynx-computed-display="linear"][lynx-linear-orientation="horizontal-reverse"] >
*) so the align-self declarations apply to child elements rather than the
container.

In @packages/web-platform/web-elements/tests/fixtures/component-event-test.html:
- Around line 14-75: Remove the unused EventTracker and EventTrackerImpl classes
and all explanatory comments, and replace them with a minimal setup: initialize
window.eventEvents = []; define a single small EventTracker class with static
observedAttributes = [] and an eventStatusChangedHandler (either static or on
the prototype/instance) that handles 'custom-event' by pushing {type, status}
into window.eventEvents so that Component's lookup
(oneReactive.eventStatusChangedHandler?.[type]) finds the handler; keep the
fixture concise and only include these necessary pieces.
🧹 Nitpick comments (5)
.changeset/wide-views-admire.md (1)

7-7: Consider using a proper heading instead of bold text.

The markdown linter suggests using a heading (e.g., ## This is a BREAKING CHANGE) instead of bold emphasis for better semantic structure.

♻️ Optional refactor
-**This is a BREAKING CHANGE**
+## BREAKING CHANGE
packages/web-platform/web-elements/src/compat/LinearContainer/LinearContainer.ts (1)

71-75: Consider improving type safety for cssPropertyChangedHandler.

The @ts-expect-error comment suggests a type mismatch when assigning cssPropertyChangedHandler. While this works at runtime, consider defining a proper interface or type assertion to improve maintainability and catch future type errors.

packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts (1)

21-26: Remove unused title parameter.

The title parameter is declared but never used in the function body. Consider removing it to avoid confusion.

♻️ Suggested fix
-const goto = async (page: Page, title?: string) => {
+const goto = async (page: Page) => {
   await page.goto('/?resourceName=web-core.main-thread.json', {
     waitUntil: 'load',
   });
   await wait(500);
 };
packages/web-platform/web-elements/tests/fixtures/shell-project.ts (1)

5-10: Remove unused registerEventEnableStatusChangeHandler export.

The registerEventEnableStatusChangeHandler is exposed on globalThis but is never used in component-event-test.html. The fixture manually constructs the event handler structure instead of using this decorator function.

♻️ Simplify by removing unused export
-import { Component } from '../../src/element-reactive/component.js';
-import { registerEventEnableStatusChangeHandler } from '../../src/element-reactive/registerEventStatusChangedHandler.js';
+import { Component } from '../../src/element-reactive/component.js';

 (globalThis as any).Component = Component;
-(globalThis as any).registerEventEnableStatusChangeHandler =
-  registerEventEnableStatusChangeHandler;
packages/web-platform/web-elements/tests/fixtures/component-event-test.html (1)

11-12: Remove unused registerEventEnableStatusChangeHandler variable.

The registerEventEnableStatusChangeHandler is destructured from globalThis but never used in this fixture.

♻️ Simplify destructuring
-    const { Component, registerEventEnableStatusChangeHandler } =
-        globalThis;
+    const { Component } = globalThis;
📜 Review details

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between ecf66fa and 522d08e.

📒 Files selected for processing (31)
  • .changeset/wide-views-admire.md
  • packages/web-platform/web-core-wasm-e2e/tests/utils.ts
  • packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
  • packages/web-platform/web-core-wasm/css/in_shadow.css
  • packages/web-platform/web-core-wasm/css/linear.css
  • packages/web-platform/web-elements/elements.css
  • packages/web-platform/web-elements/index.css
  • packages/web-platform/web-elements/package.json
  • packages/web-platform/web-elements/src/compat/LinearContainer/LinearContainer.ts
  • packages/web-platform/web-elements/src/compat/LinearContainer/linear-compat.css
  • packages/web-platform/web-elements/src/compat/index.ts
  • packages/web-platform/web-elements/src/element-reactive/component.ts
  • packages/web-platform/web-elements/src/elements/ScrollView/ScrollView.ts
  • packages/web-platform/web-elements/src/elements/XFoldViewNg/XFoldviewHeaderNg.ts
  • packages/web-platform/web-elements/src/elements/XFoldViewNg/XFoldviewNg.ts
  • packages/web-platform/web-elements/src/elements/XFoldViewNg/XFoldviewSlotDragNg.ts
  • packages/web-platform/web-elements/src/elements/XFoldViewNg/XFoldviewSlotNg.ts
  • packages/web-platform/web-elements/src/elements/XFoldViewNg/XFoldviewToolbarNg.ts
  • packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshFooter.ts
  • packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshHeader.ts
  • packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshView.ts
  • packages/web-platform/web-elements/src/elements/XSwiper/SwiperItem.ts
  • packages/web-platform/web-elements/src/elements/XView/XView.ts
  • packages/web-platform/web-elements/src/elements/XViewpagerNg/XViewpagerItemNg.ts
  • packages/web-platform/web-elements/src/elements/XViewpagerNg/XViewpagerNg.ts
  • packages/web-platform/web-elements/src/elements/common-css/linear.css
  • packages/web-platform/web-elements/tests/component-event.spec.ts
  • packages/web-platform/web-elements/tests/fixtures/component-event-test.html
  • packages/web-platform/web-elements/tests/fixtures/shell-project.ts
  • packages/web-platform/web-tests/shell-project/lynx-view.ts
  • packages/web-platform/web-tests/shell-project/web-core.ts
💤 Files with no reviewable changes (7)
  • packages/web-platform/web-elements/package.json
  • packages/web-platform/web-elements/src/elements/common-css/linear.css
  • packages/web-platform/web-tests/shell-project/web-core.ts
  • packages/web-platform/web-core-wasm-e2e/tests/utils.ts
  • packages/web-platform/web-elements/elements.css
  • packages/web-platform/web-tests/shell-project/lynx-view.ts
  • packages/web-platform/web-core-wasm/css/linear.css
🚧 Files skipped from review as they are similar to previous changes (11)
  • packages/web-platform/web-elements/src/elements/XFoldViewNg/XFoldviewHeaderNg.ts
  • packages/web-platform/web-elements/src/elements/XFoldViewNg/XFoldviewToolbarNg.ts
  • packages/web-platform/web-elements/src/elements/XFoldViewNg/XFoldviewSlotDragNg.ts
  • packages/web-platform/web-elements/src/elements/XSwiper/SwiperItem.ts
  • packages/web-platform/web-elements/src/elements/XFoldViewNg/XFoldviewNg.ts
  • packages/web-platform/web-elements/src/elements/XViewpagerNg/XViewpagerNg.ts
  • packages/web-platform/web-elements/tests/component-event.spec.ts
  • packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshFooter.ts
  • packages/web-platform/web-elements/index.css
  • packages/web-platform/web-elements/src/elements/XViewpagerNg/XViewpagerItemNg.ts
  • packages/web-platform/web-elements/src/elements/ScrollView/ScrollView.ts
🧰 Additional context used
📓 Path-based instructions (5)
**/*.{ts,tsx}

📄 CodeRabbit inference engine (AGENTS.md)

Use TypeScript in strict mode with the configuration specified in tsconfig.json

Files:

  • packages/web-platform/web-elements/src/compat/index.ts
  • packages/web-platform/web-elements/src/elements/XFoldViewNg/XFoldviewSlotNg.ts
  • packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshView.ts
  • packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
  • packages/web-platform/web-elements/src/compat/LinearContainer/LinearContainer.ts
  • packages/web-platform/web-elements/src/element-reactive/component.ts
  • packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshHeader.ts
  • packages/web-platform/web-elements/tests/fixtures/shell-project.ts
  • packages/web-platform/web-elements/src/elements/XView/XView.ts
**/*.{js,ts,tsx}

📄 CodeRabbit inference engine (AGENTS.md)

**/*.{js,ts,tsx}: Follow eslint rules as configured in eslint.config.js including React and TypeScript specific rules
Follow code formatting rules specified in .dprint.jsonc and biome.jsonc

Files:

  • packages/web-platform/web-elements/src/compat/index.ts
  • packages/web-platform/web-elements/src/elements/XFoldViewNg/XFoldviewSlotNg.ts
  • packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshView.ts
  • packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
  • packages/web-platform/web-elements/src/compat/LinearContainer/LinearContainer.ts
  • packages/web-platform/web-elements/src/element-reactive/component.ts
  • packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshHeader.ts
  • packages/web-platform/web-elements/tests/fixtures/shell-project.ts
  • packages/web-platform/web-elements/src/elements/XView/XView.ts
packages/web-platform/web-elements/src/elements/**/*.ts

📄 CodeRabbit inference engine (packages/web-platform/web-elements/AGENTS.md)

packages/web-platform/web-elements/src/elements/**/*.ts: When creating new elements, inherit from Element via Component decorator and use reactive utilities provided by element-reactive
Use boostedQueueMicrotask for DOM reads/writes to avoid synchronous layout thrashing when accurate layout info isn't immediately needed
Do NOT implement attribute handlers decorated with @registerAttributeHandler directly on the main Element class decorated with @Component. Create a separate Attribute Class implementing AttributeReactiveClass logic and pass it as the second argument to the @Component decorator
Add boolean-like attributes that should not be filtered when set to 'false' string to the static readonly notToFilterFalseAttributes Set in the component class
Use genDomGetter to safely access internal elements within the Shadow DOM
When implementing a new web element, use PascalCase for class names (e.g., MyElement) and kebab-case for tag names, prefixing single-word names with x- (e.g., x-view, scroll-view)
Minimize heavy computation in attributeChangedCallback as these elements run on the main thread
Group DOM updates to minimize layout thrashing in web component implementations

Files:

  • packages/web-platform/web-elements/src/elements/XFoldViewNg/XFoldviewSlotNg.ts
  • packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshView.ts
  • packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshHeader.ts
  • packages/web-platform/web-elements/src/elements/XView/XView.ts
packages/web-platform/web-elements/src/**/*.css

📄 CodeRabbit inference engine (packages/web-platform/web-elements/AGENTS.md)

packages/web-platform/web-elements/src/**/*.css: Respect existing polyfills in src/compat and check browser support before using bleeding-edge CSS features
Use custom CSS properties to control linear layout behavior: --lynx-display: linear, --lynx-linear-orientation, --lynx-linear-weight, --lynx-linear-weight-sum, and --lynx-linear-weight-basis

Files:

  • packages/web-platform/web-elements/src/compat/LinearContainer/linear-compat.css
packages/web-platform/web-elements/tests/fixtures/**/*.html

📄 CodeRabbit inference engine (packages/web-platform/web-elements/AGENTS.md)

Use HTML files for test fixtures and define a helper function goto(page, fixtureName) to handle navigation and waiting for resources like document.fonts.ready

Files:

  • packages/web-platform/web-elements/tests/fixtures/component-event-test.html
🧠 Learnings (55)
📓 Common learnings
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-elements/AGENTS.md:0-0
Timestamp: 2025-12-29T11:26:09.502Z
Learning: Applies to packages/web-platform/web-elements/src/**/*.css : Use custom CSS properties to control linear layout behavior: `--lynx-display: linear`, `--lynx-linear-orientation`, `--lynx-linear-weight`, `--lynx-linear-weight-sum`, and `--lynx-linear-weight-basis`
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-elements/AGENTS.md:0-0
Timestamp: 2025-12-29T11:26:09.502Z
Learning: Applies to packages/web-platform/web-elements/src/**/*.css : Respect existing polyfills in `src/compat` and check browser support before using bleeding-edge CSS features
📚 Learning: 2025-12-29T11:26:09.502Z
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-elements/AGENTS.md:0-0
Timestamp: 2025-12-29T11:26:09.502Z
Learning: Applies to packages/web-platform/web-elements/src/elements/all.ts : Export new components in `src/elements/all.ts` and add export configuration to `package.json` under `exports` for both types and default

Applied to files:

  • packages/web-platform/web-elements/src/compat/index.ts
  • packages/web-platform/web-elements/src/elements/XFoldViewNg/XFoldviewSlotNg.ts
  • packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshView.ts
  • packages/web-platform/web-elements/src/compat/LinearContainer/LinearContainer.ts
  • packages/web-platform/web-elements/src/element-reactive/component.ts
  • packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshHeader.ts
  • packages/web-platform/web-elements/tests/fixtures/component-event-test.html
  • packages/web-platform/web-elements/tests/fixtures/shell-project.ts
  • packages/web-platform/web-elements/src/elements/XView/XView.ts
📚 Learning: 2025-12-29T11:26:09.502Z
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-elements/AGENTS.md:0-0
Timestamp: 2025-12-29T11:26:09.502Z
Learning: Applies to packages/web-platform/web-elements/src/**/*.css : Use custom CSS properties to control linear layout behavior: `--lynx-display: linear`, `--lynx-linear-orientation`, `--lynx-linear-weight`, `--lynx-linear-weight-sum`, and `--lynx-linear-weight-basis`

Applied to files:

  • packages/web-platform/web-elements/src/compat/index.ts
  • .changeset/wide-views-admire.md
  • packages/web-platform/web-elements/src/compat/LinearContainer/LinearContainer.ts
  • packages/web-platform/web-core-wasm/css/in_shadow.css
  • packages/web-platform/web-elements/src/compat/LinearContainer/linear-compat.css
  • packages/web-platform/web-elements/src/elements/XView/XView.ts
📚 Learning: 2025-12-29T11:26:09.502Z
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-elements/AGENTS.md:0-0
Timestamp: 2025-12-29T11:26:09.502Z
Learning: Applies to packages/web-platform/web-elements/src/elements/**/index.ts : Ensure `index.ts` files and complex logic have clear, descriptive comments matching the implementation

Applied to files:

  • packages/web-platform/web-elements/src/compat/index.ts
  • packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshView.ts
  • packages/web-platform/web-elements/src/compat/LinearContainer/LinearContainer.ts
  • packages/web-platform/web-elements/src/element-reactive/component.ts
  • packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshHeader.ts
  • packages/web-platform/web-elements/tests/fixtures/component-event-test.html
  • packages/web-platform/web-elements/tests/fixtures/shell-project.ts
  • packages/web-platform/web-elements/src/elements/XView/XView.ts
📚 Learning: 2025-12-29T11:26:09.502Z
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-elements/AGENTS.md:0-0
Timestamp: 2025-12-29T11:26:09.502Z
Learning: Applies to packages/web-platform/web-elements/src/**/*.css : Respect existing polyfills in `src/compat` and check browser support before using bleeding-edge CSS features

Applied to files:

  • packages/web-platform/web-elements/src/compat/index.ts
  • packages/web-platform/web-elements/src/compat/LinearContainer/LinearContainer.ts
  • packages/web-platform/web-core-wasm/css/in_shadow.css
  • packages/web-platform/web-elements/src/compat/LinearContainer/linear-compat.css
📚 Learning: 2025-12-29T11:26:09.502Z
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-elements/AGENTS.md:0-0
Timestamp: 2025-12-29T11:26:09.502Z
Learning: Applies to packages/web-platform/web-elements/src/elements/**/*.ts : When creating new elements, inherit from `Element` via `Component` decorator and use reactive utilities provided by `element-reactive`

Applied to files:

  • packages/web-platform/web-elements/src/compat/index.ts
  • packages/web-platform/web-elements/src/elements/XFoldViewNg/XFoldviewSlotNg.ts
  • packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshView.ts
  • packages/web-platform/web-elements/src/compat/LinearContainer/LinearContainer.ts
  • packages/web-platform/web-elements/src/element-reactive/component.ts
  • packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshHeader.ts
  • packages/web-platform/web-elements/tests/fixtures/component-event-test.html
  • packages/web-platform/web-elements/tests/fixtures/shell-project.ts
  • packages/web-platform/web-elements/src/elements/XView/XView.ts
📚 Learning: 2025-12-29T11:26:09.502Z
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-elements/AGENTS.md:0-0
Timestamp: 2025-12-29T11:26:09.502Z
Learning: Applies to packages/web-platform/web-elements/src/elements/**/*.ts : Group DOM updates to minimize layout thrashing in web component implementations

Applied to files:

  • packages/web-platform/web-elements/src/compat/index.ts
  • packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshView.ts
  • packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
  • packages/web-platform/web-elements/src/compat/LinearContainer/LinearContainer.ts
  • packages/web-platform/web-elements/src/compat/LinearContainer/linear-compat.css
  • packages/web-platform/web-elements/src/element-reactive/component.ts
  • packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshHeader.ts
  • packages/web-platform/web-elements/tests/fixtures/component-event-test.html
  • packages/web-platform/web-elements/tests/fixtures/shell-project.ts
  • packages/web-platform/web-elements/src/elements/XView/XView.ts
📚 Learning: 2025-09-12T09:43:04.847Z
Learnt from: gaoachao
Repo: lynx-family/lynx-stack PR: 1736
File: .changeset/spotty-experts-smoke.md:1-3
Timestamp: 2025-09-12T09:43:04.847Z
Learning: In the lynx-family/lynx-stack repository, private packages (marked with "private": true in package.json) like lynx-js/react-transform don't require meaningful changeset entries even when their public APIs change, since they are not published externally and only affect internal development.

Applied to files:

  • .changeset/wide-views-admire.md
  • packages/web-platform/web-core-wasm/css/in_shadow.css
📚 Learning: 2025-09-12T09:43:04.847Z
Learnt from: gaoachao
Repo: lynx-family/lynx-stack PR: 1736
File: .changeset/spotty-experts-smoke.md:1-3
Timestamp: 2025-09-12T09:43:04.847Z
Learning: In the lynx-family/lynx-stack repository, empty changeset files (containing only `---\n\n---`) are used for internal changes that modify src/** files but don't require meaningful release notes, such as private package changes or testing-only modifications. This satisfies CI requirements without generating user-facing release notes.

Applied to files:

  • .changeset/wide-views-admire.md
📚 Learning: 2025-12-29T11:26:09.502Z
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-elements/AGENTS.md:0-0
Timestamp: 2025-12-29T11:26:09.502Z
Learning: The `web-elements` package provides a Native UI implementation for the LynxJS Web Platform using Web Components built on the `element-reactive` reactive framework

Applied to files:

  • .changeset/wide-views-admire.md
  • packages/web-platform/web-elements/src/compat/LinearContainer/LinearContainer.ts
  • packages/web-platform/web-core-wasm/css/in_shadow.css
  • packages/web-platform/web-elements/tests/fixtures/shell-project.ts
📚 Learning: 2025-07-22T09:23:07.797Z
Learnt from: colinaaa
Repo: lynx-family/lynx-stack PR: 1330
File: .changeset/olive-animals-attend.md:1-3
Timestamp: 2025-07-22T09:23:07.797Z
Learning: In the lynx-family/lynx-stack repository, changesets are only required for meaningful changes to end-users such as bugfixes and features. Internal/development changes like chores, refactoring, or removing debug info do not need changeset entries.

Applied to files:

  • .changeset/wide-views-admire.md
📚 Learning: 2025-08-14T12:54:51.143Z
Learnt from: upupming
Repo: lynx-family/lynx-stack PR: 1370
File: .changeset/brave-melons-add.md:1-7
Timestamp: 2025-08-14T12:54:51.143Z
Learning: In the lynx-family/lynx-stack repository, packages use 0.x.x versioning where minor version bumps indicate breaking changes (not major bumps), following pre-1.0 semantic versioning conventions.

Applied to files:

  • .changeset/wide-views-admire.md
📚 Learning: 2025-08-19T11:25:36.127Z
Learnt from: colinaaa
Repo: lynx-family/lynx-stack PR: 1558
File: .changeset/solid-squids-fall.md:2-2
Timestamp: 2025-08-19T11:25:36.127Z
Learning: In the lynx-family/lynx-stack repository, changesets should use the exact package name from package.json#name, not generic or unscoped names. Each package has its own specific scoped name (e.g., "lynx-js/react-transform" for packages/react/transform).

Applied to files:

  • .changeset/wide-views-admire.md
📚 Learning: 2025-07-22T09:26:16.722Z
Learnt from: colinaaa
Repo: lynx-family/lynx-stack PR: 1330
File: .changeset/olive-animals-attend.md:1-3
Timestamp: 2025-07-22T09:26:16.722Z
Learning: In the lynx-family/lynx-stack repository, CI checks require changesets when files matching the pattern "src/**" are modified (as configured in .changeset/config.json). For internal changes that don't need meaningful changesets, an empty changeset file is used to satisfy the CI requirement while not generating any release notes.

Applied to files:

  • .changeset/wide-views-admire.md
📚 Learning: 2025-08-13T11:36:12.075Z
Learnt from: colinaaa
Repo: lynx-family/lynx-stack PR: 1523
File: vitest.config.ts:52-72
Timestamp: 2025-08-13T11:36:12.075Z
Learning: The lynx-stack project requires Node.js >=22 as specified in package.json engines, so Node.js compatibility fallbacks for features introduced before v22 are unnecessary.

Applied to files:

  • .changeset/wide-views-admire.md
📚 Learning: 2025-09-18T04:43:54.426Z
Learnt from: gaoachao
Repo: lynx-family/lynx-stack PR: 1771
File: packages/react/transform/tests/__swc_snapshots__/src/swc_plugin_snapshot/mod.rs/basic_component_with_static_sibling.js:2-2
Timestamp: 2025-09-18T04:43:54.426Z
Learning: In the lynx-family/lynx-stack repository, the `add_pure_comment` function in packages/react/transform/src/swc_plugin_compat/mod.rs (around lines 478-482) is specifically for `wrapWithLynxComponent` calls, not `createSnapshot` calls. The PURE comment injection for `createSnapshot` is handled separately in swc_plugin_snapshot/mod.rs.

Applied to files:

  • .changeset/wide-views-admire.md
📚 Learning: 2025-12-29T11:26:09.502Z
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-elements/AGENTS.md:0-0
Timestamp: 2025-12-29T11:26:09.502Z
Learning: Applies to packages/web-platform/web-elements/tests/**/*.spec.ts : Create a separate spec file for new components (e.g., `tests/x-webview.spec.ts`) instead of adding to the monolithic `web-elements.spec.ts`

Applied to files:

  • packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshView.ts
  • packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
  • packages/web-platform/web-elements/tests/fixtures/component-event-test.html
  • packages/web-platform/web-elements/tests/fixtures/shell-project.ts
  • packages/web-platform/web-elements/src/elements/XView/XView.ts
📚 Learning: 2025-12-29T11:26:09.502Z
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-elements/AGENTS.md:0-0
Timestamp: 2025-12-29T11:26:09.502Z
Learning: Applies to packages/web-platform/web-elements/src/elements/**/*.ts : Do NOT implement attribute handlers decorated with `registerAttributeHandler` directly on the main Element class decorated with `Component`. Create a separate Attribute Class implementing `AttributeReactiveClass` logic and pass it as the second argument to the `Component` decorator

Applied to files:

  • packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshView.ts
  • packages/web-platform/web-elements/src/compat/LinearContainer/LinearContainer.ts
  • packages/web-platform/web-elements/src/element-reactive/component.ts
  • packages/web-platform/web-elements/tests/fixtures/component-event-test.html
  • packages/web-platform/web-elements/tests/fixtures/shell-project.ts
📚 Learning: 2025-12-29T11:26:09.502Z
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-elements/AGENTS.md:0-0
Timestamp: 2025-12-29T11:26:09.502Z
Learning: Applies to packages/web-platform/web-elements/src/elements/**/*.ts : Minimize heavy computation in `attributeChangedCallback` as these elements run on the main thread

Applied to files:

  • packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshView.ts
  • packages/web-platform/web-elements/src/compat/LinearContainer/LinearContainer.ts
  • packages/web-platform/web-elements/src/element-reactive/component.ts
  • packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshHeader.ts
  • packages/web-platform/web-elements/tests/fixtures/component-event-test.html
  • packages/web-platform/web-elements/tests/fixtures/shell-project.ts
📚 Learning: 2025-12-29T11:26:09.502Z
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-elements/AGENTS.md:0-0
Timestamp: 2025-12-29T11:26:09.502Z
Learning: Applies to packages/web-platform/web-elements/src/elements/{x-input,x-textarea,x-image}/**/*.ts : For `x-input`, `x-textarea`, and `x-image` elements, control styling properties like placeholders and blur radii via attributes (e.g., `placeholder-color`, `blur-radius`) which internally map to CSS variables

Applied to files:

  • packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshView.ts
  • packages/web-platform/web-elements/src/compat/LinearContainer/LinearContainer.ts
  • packages/web-platform/web-core-wasm/css/in_shadow.css
  • packages/web-platform/web-elements/src/compat/LinearContainer/linear-compat.css
📚 Learning: 2025-12-29T11:26:09.502Z
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-elements/AGENTS.md:0-0
Timestamp: 2025-12-29T11:26:09.502Z
Learning: Applies to packages/web-platform/web-elements/tests/**/*.spec.ts : Use Playwright for all E2E and functional tests with standard assertions like `expect(locator).toBeVisible()`, `expect(locator).toHaveCSS()`, and `diffScreenShot` for screenshot comparisons

Applied to files:

  • packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
  • packages/web-platform/web-elements/tests/fixtures/component-event-test.html
  • packages/web-platform/web-elements/tests/fixtures/shell-project.ts
📚 Learning: 2025-12-26T05:10:01.608Z
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: AGENTS.md:0-0
Timestamp: 2025-12-26T05:10:01.608Z
Learning: Applies to packages/web-platform/web-tests/**/*.{ts,tsx,js} : Use Playwright for E2E tests in packages/web-platform/web-tests/

Applied to files:

  • packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
  • packages/web-platform/web-elements/tests/fixtures/shell-project.ts
📚 Learning: 2025-12-29T11:26:09.502Z
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-elements/AGENTS.md:0-0
Timestamp: 2025-12-29T11:26:09.502Z
Learning: Applies to packages/web-platform/web-elements/tests/fixtures/**/*.html : Use HTML files for test fixtures and define a helper function `goto(page, fixtureName)` to handle navigation and waiting for resources like `document.fonts.ready`

Applied to files:

  • packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
  • packages/web-platform/web-elements/tests/fixtures/component-event-test.html
  • packages/web-platform/web-elements/tests/fixtures/shell-project.ts
📚 Learning: 2025-12-29T11:26:09.502Z
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-elements/AGENTS.md:0-0
Timestamp: 2025-12-29T11:26:09.502Z
Learning: Applies to packages/web-platform/web-elements/tests/**/*.spec.ts : When a component makes external requests (e.g., via `iframe` or `fetch`), mock them using `page.route` in Playwright tests to ensure tests are hermetic and fast

Applied to files:

  • packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
  • packages/web-platform/web-elements/tests/fixtures/component-event-test.html
  • packages/web-platform/web-elements/tests/fixtures/shell-project.ts
📚 Learning: 2026-01-04T11:17:23.990Z
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-core-wasm/AGENTS.md:0-0
Timestamp: 2026-01-04T11:17:23.990Z
Learning: When modifying Rust core logic in src/main_thread, ALWAYS add corresponding tests in tests/element-apis.spec.ts to verify the JS-side behavior

Applied to files:

  • packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
📚 Learning: 2025-12-29T11:26:09.502Z
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-elements/AGENTS.md:0-0
Timestamp: 2025-12-29T11:26:09.502Z
Learning: Applies to packages/web-platform/web-elements/tests/**/*.spec.ts : In Playwright tests, access Shadow DOM explicitly using `.shadowRoot` when using `evaluate` or `waitForFunction`, as document.querySelector fails to directly access shadow DOM elements

Applied to files:

  • packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
  • packages/web-platform/web-elements/tests/fixtures/shell-project.ts
📚 Learning: 2025-12-29T11:26:09.502Z
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-elements/AGENTS.md:0-0
Timestamp: 2025-12-29T11:26:09.502Z
Learning: Applies to packages/web-platform/web-elements/src/elements/**/*.ts : Use `boostedQueueMicrotask` for DOM reads/writes to avoid synchronous layout thrashing when accurate layout info isn't immediately needed

Applied to files:

  • packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
📚 Learning: 2025-08-27T12:42:01.095Z
Learnt from: upupming
Repo: lynx-family/lynx-stack PR: 1616
File: packages/webpack/cache-events-webpack-plugin/test/cases/not-cache-events/lazy-bundle/index.js:3-3
Timestamp: 2025-08-27T12:42:01.095Z
Learning: In webpack, properties like __webpack_require__.lynx_ce are injected during compilation/build time when webpack processes modules and generates bundles, not at runtime when dynamic imports execute. Tests for such properties don't need to wait for dynamic imports to complete.

Applied to files:

  • packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
📚 Learning: 2025-10-10T08:22:12.051Z
Learnt from: Sherry-hue
Repo: lynx-family/lynx-stack PR: 1837
File: packages/web-platform/web-mainthread-apis/src/prepareMainThreadAPIs.ts:266-266
Timestamp: 2025-10-10T08:22:12.051Z
Learning: In packages/web-platform/web-mainthread-apis, the handleUpdatedData function returned from prepareMainThreadAPIs is internal-only, used to serve web-core. It does not require public documentation, type exports, or SSR support.

Applied to files:

  • packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
📚 Learning: 2025-09-10T10:27:32.903Z
Learnt from: PupilTong
Repo: lynx-family/lynx-stack PR: 1706
File: .github/workflows/test.yml:0-0
Timestamp: 2025-09-10T10:27:32.903Z
Learning: MULTI_THREAD×SSR combination is NYI (Not Yet Implemented) in the Playwright test configuration, which is why it's excluded from the test matrix in .github/workflows/test.yml.

Applied to files:

  • packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
📚 Learning: 2025-08-11T05:57:18.212Z
Learnt from: upupming
Repo: lynx-family/lynx-stack PR: 1305
File: packages/testing-library/testing-environment/src/index.ts:255-258
Timestamp: 2025-08-11T05:57:18.212Z
Learning: In the ReactLynx testing environment (`packages/testing-library/testing-environment/src/index.ts`), the dual assignment pattern `target.console.method = console.method = () => {}` is required for rstest compatibility. This is because rstest provides `console` in an IIFE (Immediately Invoked Function Expression), and both the target and global console need to have these methods defined for proper test execution.

Applied to files:

  • packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
  • packages/web-platform/web-elements/tests/fixtures/component-event-test.html
📚 Learning: 2025-08-21T08:46:54.494Z
Learnt from: upupming
Repo: lynx-family/lynx-stack PR: 1370
File: packages/webpack/cache-events-webpack-plugin/src/LynxCacheEventsRuntimeModule.ts:23-27
Timestamp: 2025-08-21T08:46:54.494Z
Learning: In Lynx webpack runtime modules, the team prioritizes performance and simplicity over defensive runtime error handling. They prefer relying on compile-time type safety (TypeScript) rather than adding runtime checks like try-catch blocks or type validation, especially for performance-critical code like cache event setup/cleanup functions.

Applied to files:

  • packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
📚 Learning: 2025-09-28T07:52:03.601Z
Learnt from: Sherry-hue
Repo: lynx-family/lynx-stack PR: 1837
File: packages/web-platform/web-worker-runtime/src/backgroundThread/background-apis/createNativeApp.ts:151-154
Timestamp: 2025-09-28T07:52:03.601Z
Learning: There are two different registerUpdateDataHandler functions in the lynx-stack codebase:
1. Main thread version in packages/web-platform/web-worker-runtime/src/mainThread/crossThreadHandlers/registerUpdateDataHandler.ts takes (mainThreadRpc: Rpc, backgroundThreadRpc: Rpc, runtime: MainThreadGlobalThis)
2. Background thread version in packages/web-platform/web-worker-runtime/src/backgroundThread/background-apis/crossThreadHandlers/registerUpdateDataHandler.ts takes only (rpc: Rpc, tt: any)

Applied to files:

  • packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
📚 Learning: 2025-09-28T07:52:03.601Z
Learnt from: Sherry-hue
Repo: lynx-family/lynx-stack PR: 1837
File: packages/web-platform/web-worker-runtime/src/backgroundThread/background-apis/createNativeApp.ts:151-154
Timestamp: 2025-09-28T07:52:03.601Z
Learning: There are two different registerUpdateDataHandler functions in the lynx-stack codebase:
1. Main thread version in packages/web-platform/web-worker-runtime/src/mainThread/crossThreadHandlers/registerUpdateDataHandler.ts takes (mainThreadRpc: Rpc, backgroundThreadRpc: Rpc, runtime: MainThreadGlobalThis)
2. Background thread version in packages/web-platform/web-worker-runtime/src/backgroundThread/background-apis/crossThreadHandlers/registerUpdateDataHandler.ts takes only (rpc: Rpc, tt: NativeTTObject)

Applied to files:

  • packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
📚 Learning: 2025-08-12T09:32:01.512Z
Learnt from: upupming
Repo: lynx-family/lynx-stack PR: 1370
File: packages/rspeedy/plugin-react/src/entry.ts:237-240
Timestamp: 2025-08-12T09:32:01.512Z
Learning: The events-cache.js functionality for caching events until background threads are ready is manually tested due to the complexity of constructing automated runtime test cases that involve timing, chunk loading, and browser runtime behavior.

Applied to files:

  • packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
  • packages/web-platform/web-elements/tests/fixtures/component-event-test.html
📚 Learning: 2025-09-25T14:03:25.576Z
Learnt from: PupilTong
Repo: lynx-family/lynx-stack PR: 1834
File: packages/web-platform/web-worker-runtime/src/backgroundThread/background-apis/createChunkLoading.ts:162-171
Timestamp: 2025-09-25T14:03:25.576Z
Learning: In the lynx-stack codebase, for loadScriptAsync implementations in createChunkLoading.ts, unhandled promise rejections from readScriptAsync are intentionally not caught - the caller is expected to handle errors rather than the loadScriptAsync method itself invoking the callback with error messages.

Applied to files:

  • packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
📚 Learning: 2025-11-06T01:19:23.670Z
Learnt from: colinaaa
Repo: lynx-family/lynx-stack PR: 1917
File: packages/mcp-servers/devtool-mcp-server/tsconfig.json:8-8
Timestamp: 2025-11-06T01:19:23.670Z
Learning: The lynx-js/devtool-mcp-server package in lynx-family/lynx-stack targets Node.js >=18.19 (specified in its package.json engines), which is different from the root project's requirement of Node.js ^22 || ^24. The package uses "lib": ["ES2024.Promise"] in its tsconfig.json because it manually includes polyfills for Promise.withResolvers while maintaining compatibility with Node.js v18.

Applied to files:

  • packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
📚 Learning: 2025-08-13T11:46:43.737Z
Learnt from: colinaaa
Repo: lynx-family/lynx-stack PR: 1523
File: vitest.config.ts:5-6
Timestamp: 2025-08-13T11:46:43.737Z
Learning: In the lynx-stack codebase, default imports are consistently used for Node.js built-in modules (e.g., `import os from 'node:os'`, `import fs from 'node:fs'`). The TypeScript configuration supports esModuleInterop and allowSyntheticDefaultImports, making default imports the preferred pattern over namespace imports for Node.js built-ins.

Applied to files:

  • packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
  • packages/web-platform/web-core-wasm/css/in_shadow.css
📚 Learning: 2025-09-28T08:46:43.177Z
Learnt from: f0rdream
Repo: lynx-family/lynx-stack PR: 1835
File: packages/react/worklet-runtime/src/workletRuntime.ts:52-55
Timestamp: 2025-09-28T08:46:43.177Z
Learning: The legacy worklet path with `_lepusWorkletHash` in `packages/react/worklet-runtime/src/workletRuntime.ts` is preserved for compatibility with MTS (Mini-app Threading Service) that doesn't support Initial Frame Rendering. This path will not be touched in current implementations.

Applied to files:

  • packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
📚 Learning: 2025-08-27T11:37:38.587Z
Learnt from: PupilTong
Repo: lynx-family/lynx-stack PR: 1589
File: packages/web-platform/web-worker-runtime/src/mainThread/startMainThread.ts:36-49
Timestamp: 2025-08-27T11:37:38.587Z
Learning: In web worker script loading (loadScript function), the pattern of calling fetch() before importScripts() is intentional for caching benefits, not redundant networking. The fetch() ensures HTTP caching is utilized before the synchronous importScripts() call.

Applied to files:

  • packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
📚 Learning: 2025-08-29T16:59:22.060Z
Learnt from: PupilTong
Repo: lynx-family/lynx-stack PR: 1235
File: packages/web-platform/web-mainthread-apis/src/crossThreadHandlers/createQueryComponent.ts:33-38
Timestamp: 2025-08-29T16:59:22.060Z
Learning: The processEvalResult method in MainThreadGlobalThis interface should return the processed evaluation result rather than void, as it's used to transform lepusRootChunkExport in the lazy component loading flow.

Applied to files:

  • packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
📚 Learning: 2025-09-23T08:54:39.966Z
Learnt from: upupming
Repo: lynx-family/lynx-stack PR: 1670
File: packages/webpack/css-extract-webpack-plugin/test/hotCases/hot/hot-update-json/dual-thread/__snapshot__/index.css:6-8
Timestamp: 2025-09-23T08:54:39.966Z
Learning: In the lynx-stack CSS extract webpack plugin tests, many test fixture CSS files intentionally use invalid CSS syntax like `color: 'red';` with quoted values. The snapshots correctly reflect this invalid CSS from the source fixtures. To fix CSS validation issues, the source fixture files should be updated first, then snapshots regenerated, rather than manually editing snapshots.

Applied to files:

  • packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
  • packages/web-platform/web-elements/src/compat/LinearContainer/linear-compat.css
📚 Learning: 2025-09-18T08:12:56.802Z
Learnt from: Sherry-hue
Repo: lynx-family/lynx-stack PR: 1770
File: packages/web-platform/web-mainthread-apis/src/utils/processStyleInfo.ts:316-318
Timestamp: 2025-09-18T08:12:56.802Z
Learning: In packages/web-platform/web-mainthread-apis/src/utils/processStyleInfo.ts, the current implementation uses cardStyleElement.textContent += for lazy component styles. While this could theoretically invalidate rule indices by reparsing the stylesheet, Sherry-hue indicated that UIDs don't repeat for the same element, making this approach acceptable for now. A future optimization to use separate style elements per entry was discussed but deferred to a separate PR to keep the current lazy bundle PR focused.

Applied to files:

  • packages/web-platform/web-elements/src/compat/LinearContainer/LinearContainer.ts
  • packages/web-platform/web-core-wasm/css/in_shadow.css
  • packages/web-platform/web-elements/src/compat/LinearContainer/linear-compat.css
📚 Learning: 2025-12-29T11:26:09.502Z
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-elements/AGENTS.md:0-0
Timestamp: 2025-12-29T11:26:09.502Z
Learning: Applies to packages/web-platform/web-elements/src/elements/**/*.ts : Add boolean-like attributes that should not be filtered when set to 'false' string to the `static readonly notToFilterFalseAttributes` Set in the component class

Applied to files:

  • packages/web-platform/web-elements/src/compat/LinearContainer/LinearContainer.ts
  • packages/web-platform/web-elements/src/element-reactive/component.ts
📚 Learning: 2025-12-29T11:26:09.502Z
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-elements/AGENTS.md:0-0
Timestamp: 2025-12-29T11:26:09.502Z
Learning: Applies to packages/web-platform/web-elements/src/elements/**/*.css : Write element-specific CSS in the element's directory with filename pattern `element-name.css` and import it in `elements.css`

Applied to files:

  • packages/web-platform/web-core-wasm/css/in_shadow.css
  • packages/web-platform/web-elements/src/compat/LinearContainer/linear-compat.css
📚 Learning: 2025-12-29T11:26:09.502Z
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-elements/AGENTS.md:0-0
Timestamp: 2025-12-29T11:26:09.502Z
Learning: Use extensive CSS variables (e.g., `--lynx-display`) to drive layout and style from the Lynx engine

Applied to files:

  • packages/web-platform/web-core-wasm/css/in_shadow.css
  • packages/web-platform/web-elements/src/compat/LinearContainer/linear-compat.css
📚 Learning: 2025-07-16T06:28:26.463Z
Learnt from: PupilTong
Repo: lynx-family/lynx-stack PR: 1029
File: packages/web-platform/web-core/src/uiThread/createRenderAllOnUI.ts:95-99
Timestamp: 2025-07-16T06:28:26.463Z
Learning: In the lynx-stack codebase, CSS selectors in SSR hydration are generated by their own packages, ensuring a predictable format that makes simple string manipulation safe and preferable over regex for performance reasons.

Applied to files:

  • packages/web-platform/web-core-wasm/css/in_shadow.css
📚 Learning: 2025-07-16T06:25:41.055Z
Learnt from: PupilTong
Repo: lynx-family/lynx-stack PR: 1029
File: packages/web-platform/web-mainthread-apis/src/createMainThreadGlobalThis.ts:214-217
Timestamp: 2025-07-16T06:25:41.055Z
Learning: In the lynx-stack codebase, CSS strings produced by `genCssContent` are considered trusted developer input, so additional sanitization/escaping is not required.

Applied to files:

  • packages/web-platform/web-core-wasm/css/in_shadow.css
📚 Learning: 2025-11-03T08:44:10.706Z
Learnt from: Sherry-hue
Repo: lynx-family/lynx-stack PR: 1911
File: packages/web-platform/web-elements/src/XList/ListItemAttributes.ts:24-29
Timestamp: 2025-11-03T08:44:10.706Z
Learning: In packages/web-platform/web-elements/src/XList/ListItemAttributes.ts, the `estimated-main-axis-size-px` attribute handler does not need to validate or guard against invalid/NaN values when parsing - data correctness verification is not required for this attribute.

Applied to files:

  • packages/web-platform/web-elements/src/compat/LinearContainer/linear-compat.css
📚 Learning: 2025-12-26T05:10:01.608Z
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: AGENTS.md:0-0
Timestamp: 2025-12-26T05:10:01.608Z
Learning: Applies to packages/react/components/**/*.{ts,tsx} : Optimize component library in packages/react/components/ using ReactLynx syntax

Applied to files:

  • packages/web-platform/web-elements/src/element-reactive/component.ts
  • packages/web-platform/web-elements/tests/fixtures/shell-project.ts
📚 Learning: 2025-12-29T11:26:09.502Z
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-elements/AGENTS.md:0-0
Timestamp: 2025-12-29T11:26:09.502Z
Learning: Applies to packages/web-platform/web-elements/src/elements/**/*.ts : When implementing a new web element, use PascalCase for class names (e.g., `MyElement`) and kebab-case for tag names, prefixing single-word names with `x-` (e.g., `x-view`, `scroll-view`)

Applied to files:

  • packages/web-platform/web-elements/src/element-reactive/component.ts
📚 Learning: 2025-12-30T10:02:35.055Z
Learnt from: upupming
Repo: lynx-family/lynx-stack PR: 2081
File: packages/react/runtime/src/alog/elementPAPICall.ts:109-112
Timestamp: 2025-12-30T10:02:35.055Z
Learning: In packages/react/runtime/src/alog/elementPAPICall.ts, the helper APIs `__GetTag` and `__GetElementUniqueID` should always exist when instrumenting FiberElement PAPIs, so defensive checks for their existence are unnecessary.

Applied to files:

  • packages/web-platform/web-elements/src/element-reactive/component.ts
📚 Learning: 2025-10-11T06:16:12.517Z
Learnt from: Sherry-hue
Repo: lynx-family/lynx-stack PR: 1820
File: packages/web-platform/web-tests/tests/react.spec.ts:834-856
Timestamp: 2025-10-11T06:16:12.517Z
Learning: In packages/web-platform/web-tests/tests/react.spec.ts, the tests `basic-bindmouse` and `basic-mts-bindtouchstart` are NOT duplicates despite having similar test structures. They test different event types: `basic-bindmouse` validates mouse events (mousedown, mouseup, mousemove) with mouse-specific properties (button, buttons, x, y, pageX, pageY, clientX, clientY), while `basic-mts-bindtouchstart` validates touch events (touchstart) with touch arrays (touches, targetTouches, changedTouches). The similar test structure is coincidental and follows testing conventions.

Applied to files:

  • packages/web-platform/web-elements/tests/fixtures/component-event-test.html
📚 Learning: 2025-12-26T05:10:01.608Z
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: AGENTS.md:0-0
Timestamp: 2025-12-26T05:10:01.608Z
Learning: Applies to packages/react/**/*.{ts,tsx} : Use JSX syntax and ReactLynx components in React component files within packages/react/

Applied to files:

  • packages/web-platform/web-elements/tests/fixtures/shell-project.ts
📚 Learning: 2025-08-13T09:20:00.936Z
Learnt from: upupming
Repo: lynx-family/lynx-stack PR: 1502
File: packages/react/testing-library/types/entry.d.ts:71-71
Timestamp: 2025-08-13T09:20:00.936Z
Learning: In lynx-js/react testing library, wrapper components must have children as a required prop because they are always called with `h(WrapperComponent, null, innerElement)` where innerElement is passed as children. The type `React.JSXElementConstructor<{ children: React.ReactNode }>` correctly requires children to be mandatory.

Applied to files:

  • packages/web-platform/web-elements/tests/fixtures/shell-project.ts
🧬 Code graph analysis (4)
packages/web-platform/web-elements/src/elements/XFoldViewNg/XFoldviewSlotNg.ts (3)
packages/web-platform/web-elements/src/elements/XFoldViewNg/XFoldviewHeaderNg.ts (1)
  • Component (12-35)
packages/web-platform/web-elements/src/elements/XFoldViewNg/XFoldviewSlotDragNg.ts (1)
  • Component (10-14)
packages/web-platform/web-elements/src/compat/LinearContainer/LinearContainer.ts (1)
  • LinearContainer (89-91)
packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshView.ts (5)
packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshFooter.ts (1)
  • Component (11-23)
packages/web-platform/web-elements/src/elements/XSwiper/SwiperItem.ts (1)
  • Component (10-14)
packages/web-platform/web-elements/src/elements/XView/XView.ts (1)
  • Component (14-39)
packages/web-platform/web-elements/src/elements/XViewpagerNg/XViewpagerNg.ts (1)
  • Component (16-62)
packages/web-platform/web-elements/src/compat/LinearContainer/LinearContainer.ts (1)
  • LinearContainer (89-91)
packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshHeader.ts (6)
packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshFooter.ts (1)
  • Component (11-23)
packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshView.ts (1)
  • Component (13-73)
packages/web-platform/web-elements/src/elements/XSwiper/SwiperItem.ts (1)
  • Component (10-14)
packages/web-platform/web-elements/src/elements/XViewpagerNg/XViewpagerNg.ts (1)
  • Component (16-62)
packages/web-platform/web-elements/src/compat/LinearContainer/LinearContainer.ts (1)
  • LinearContainer (89-91)
packages/web-platform/web-elements/src/compat/index.ts (1)
  • LinearContainer (1-1)
packages/web-platform/web-elements/tests/fixtures/shell-project.ts (1)
packages/web-platform/web-elements/src/element-reactive/component.ts (1)
  • Component (65-352)
🪛 LanguageTool
.changeset/wide-views-admire.md

[grammar] ~5-~5: Ensure spelling is correct
Context: ...lynx-js/web-elements": minor --- feat: intergrate the LinearContainer Compat plugin **Th...

(QB_NEW_EN_ORTHOGRAPHY_ERROR_IDS_1)


[grammar] ~9-~9: Ensure spelling is correct
Context: ... This is a BREAKING CHANGE Not we intergrated the LinearCompat in the @lynx-js/web-...

(QB_NEW_EN_ORTHOGRAPHY_ERROR_IDS_1)

🪛 markdownlint-cli2 (0.18.1)
.changeset/wide-views-admire.md

7-7: Emphasis used instead of a heading

(MD036, no-emphasis-as-heading)

Comment thread .changeset/wide-views-admire.md Outdated
@PupilTong PupilTong force-pushed the p/hw/interigrate-web-elements-compat-pkg branch from 522d08e to 3168843 Compare January 8, 2026 10:53
**This is a BREAKING CHANGE**

Not we intergrated the `LinearCompat` in the @lynx-js/web-elements. Developers could safely remove the following imports:

```js
import '@lynx-js/web-elements/compat/LinearContainer';
```

```js
import '@lynx-js/web-elements-compat/LinearContainer';
```
Copy link
Copy Markdown
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: 3

Caution

Some comments are outside the diff and can’t be posted inline due to platform limitations.

⚠️ Outside diff range comments (2)
packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts (1)

368-397: Variable scope bug: success is not accessible across evaluation contexts.

The test has a critical scope issue. The success variable is declared in the Node.js test context (line 372), but line 379 attempts to assign to it from within page.evaluate(), which runs in the browser context. Variables from the Node.js context are not accessible inside page.evaluate(), and assignments there create local variables that are lost when the evaluation completes.

Line 393-395 attempts to read success from the browser context, but no browser-scoped success variable was properly initialized.

🐛 Proposed fix
  test('event-i18n-resources-missed', async ({ page, browserName }) => {
    // firefox dose not support this.
    test.skip(browserName === 'firefox');
    await goto(page);
-   let success = false;
    await page.evaluate(() => {
+     (window as any).testSuccess = false;
      (document.querySelector('lynx-view') as LynxViewElement).addEventListener(
        'i18nResourceMissed',
        (event) => {
-         // @ts-expect-error
          if (event.detail.channel === '2') {
-           success = true;
+           (window as any).testSuccess = true;
          }
        },
      );
    });
    await page.evaluate(() => {
      globalThis.runtime.renderPage = () => {};
      globalThis.runtime._I18nResourceTranslation({
        locale: 'en',
        channel: '2',
        fallback_url: '',
      });
    });
    await wait(500);
-   success = await page.evaluate<boolean>(() => {
-     return success;
-   });
+   const success = await page.evaluate<boolean>(() => {
+     return (window as any).testSuccess;
+   });
    expect(success).toBeTruthy();
  });
packages/web-platform/web-elements/src/element-reactive/component.ts (1)

327-345: Critical bug: removeEventListener fails to handle listeners added multiple times.

When a listener is added multiple times (e.g., addEventListener('click', handler) called twice), the weak map correctly tracks currentListenerCount = 2. However, removeEventListener only handles the case where currentListenerCount === 1:

  1. It doesn't decrement the weak map count when currentListenerCount > 1
  2. It doesn't call disableEvent(type) when currentListenerCount > 1

This causes:

  • The event count to never decrease, preventing handlers from being notified when listeners are removed
  • The weak map to retain stale counts
  • Memory leaks and incorrect event status notifications
🐛 Proposed fix
       override removeEventListener(
         type: string,
         listener: EventListener,
         options?: AddEventListenerOptions | boolean,
       ): void {
         super.removeEventListener(type, listener, options);
         const capture = typeof options === 'object' ? options.capture : options;
         const targetEventInfo = this.#eventListenerMap[type];
         if (targetEventInfo && targetEventInfo.count > 0) {
           const targetMap = capture
             ? targetEventInfo.captureListenerCount
             : targetEventInfo.listenerCount;
           const currentListenerCount = targetMap.get(listener);
-          if (currentListenerCount === 1) {
-            targetMap.delete(listener);
-            this.disableEvent(type);
+          if (currentListenerCount) {
+            if (currentListenerCount === 1) {
+              targetMap.delete(listener);
+            } else {
+              targetMap.set(listener, currentListenerCount - 1);
+            }
+            this.disableEvent(type);
           }
         }
       }
🤖 Fix all issues with AI agents
In @.changeset/wide-views-admire.md:
- Line 5: Fix the two spelling errors in the changeset by replacing "intergrate"
with "integrate" (occurs in the heading "feat: intergrate the LinearContainer
Compat plugin") and replacing "Not we intergrated" with "Now we integrated"
(occurs on the later line flagged, also line 9); update both occurrences so the
changeset reads correctly.

In
@packages/web-platform/web-elements/src/compat/LinearContainer/linear-compat.css:
- Around line 104-123: The align-self rules are targeting the container because
two selector variants are missing the child combinator; update the selectors
that currently read
[lynx-computed-display="linear"][lynx-linear-orientation="vertical-reverse"] and
[lynx-computed-display="linear"][lynx-linear-orientation="horizontal-reverse"]
so they include the child selector like > * (matching the other lines that use >
* and > lynx-wrapper > *), ensuring align-self applies to the flex children
rather than the container itself.

In @packages/web-platform/web-elements/tests/fixtures/component-event-test.html:
- Around line 14-90: Remove the dead scaffolding and exploratory comments and
the two unused classes (EventTracker and EventTrackerImpl); keep only the
concrete implementation EventTrackerManual (including its instance property
eventStatusChangedHandler and the static observedAttributes assignment) so the
test fixture is minimal and functional, and ensure any references to
window.eventEvents remain in EventTrackerManual's handler for test assertions.
🧹 Nitpick comments (8)
.github/workflows/workflow-test.yml (1)

101-101: Consider adding a space for consistency.

While both ${{ inputs.web-report-path}} and ${{ inputs.web-report-path }} are valid, the latter matches the style used on line 100 (${{ inputs.web-report-name }}).

✨ Suggested formatting fix
-          path: ${{ inputs.web-report-path}}
+          path: ${{ inputs.web-report-path }}
packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts (6)

77-77: Consider using specific callback types instead of unknown.

The callback parameters have been changed to unknown, which reduces type safety. While the tests perform runtime checks, using proper types (e.g., (ids: string[]) => or (err: Error | null, exports: string) =>) would catch type mismatches at compile time.

Example for Line 77
-          (ids: unknown) => {
+          (ids: string[]) => {
-            if (Array.isArray(ids) && ids[0] === '0-13826000') {
+            if (ids[0] === '0-13826000') {
               resolve(true);
             }

Also applies to: 102-102, 125-125, 131-131, 155-155


267-272: Message checks are now less strict.

The change from exact equality (message.text() === 'green') to substring matching (message.text().includes('green')) could match unintended messages. If possible, use exact string matching or more specific patterns to reduce false positives.

Also applies to: 298-303


416-443: Avoid as any casts; use proper typing or optional chaining.

Using as any completely disables type checking and could hide runtime errors if querySelector returns null or if the element doesn't have the expected methods. Consider using optional chaining or proper type guards.

♻️ Proposed refactor
  await page.evaluate(() => {
-   (document.querySelector('lynx-view') as any)?.updateI18nResources([
+   const lynxView = document.querySelector('lynx-view') as LynxViewElement | null;
+   lynxView?.updateI18nResources([
      {
        options: {
          locale: 'en',

If LynxViewElement doesn't have the updateI18nResources method in its type definition, consider updating the type definition rather than using as any.

Also applies to: 503-530, 599-626


344-345: Consider casting to LynxViewElement for consistency.

While the optional chaining handles the null case correctly, casting to HTMLElement instead of LynxViewElement loses the specific element type. For consistency with other parts of the test, consider using LynxViewElement.

-     (document.querySelector('lynx-view') as HTMLElement)?.click();
+     (document.querySelector('lynx-view') as LynxViewElement)?.click();

69-69: Consider replacing arbitrary waits with Playwright's built-in waiting mechanisms.

The test contains several wait() calls with arbitrary durations (e.g., wait(200), wait(500)). These can make tests slower and more flaky. Consider using Playwright's built-in mechanisms like waitForFunction(), waitForEvent(), or waitForTimeout() with appropriate conditions instead of fixed delays.

Based on learnings: As per coding guidelines, Playwright tests should use standard assertions and waiting mechanisms.

Also applies to: 314-314, 322-322, 392-392


374-382: Consider defining a proper event type instead of suppressing the error.

The @ts-expect-error comment at line 377 suggests that the event type doesn't include the detail property. Consider defining a proper CustomEvent type for the i18nResourceMissed event with a typed detail property.

interface I18nResourceMissedEvent extends CustomEvent {
  detail: { channel: string; /* other properties */ };
}

Then the event listener can be properly typed without suppressing errors.

packages/web-platform/web-elements/tests/component-event.spec.ts (1)

3-8: Consider extracting the navigation helper to a shared utility.

The gotoWebComponentPage helper duplicates navigation logic that may benefit from centralization. If multiple test files need this pattern, consider extracting it to a shared test utilities module.

📝 Example shared utility structure

Create a shared utilities file such as tests/utils/navigation.ts:

export const gotoWebComponentPage = async (page: any, testname: string) => {
  await page.goto(`/tests/fixtures/${testname}.html`, {
    waitUntil: 'load',
  });
  await page.evaluate(() => document.fonts.ready);
};

Then import and use it across test files.

@PupilTong PupilTong force-pushed the p/hw/interigrate-web-elements-compat-pkg branch from 3168843 to 7506b88 Compare January 8, 2026 10:59
Copy link
Copy Markdown
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

Caution

Some comments are outside the diff and can’t be posted inline due to platform limitations.

⚠️ Outside diff range comments (2)
packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts (1)

368-397: Critical: Variable scope error prevents test from working correctly.

The success variable is declared in the Node.js context (line 372) but the code attempts to set it from within page.evaluate() on line 379, which runs in the browser context. These are separate execution contexts, so the assignment on line 379 won't affect the Node.js variable. Additionally, lines 393-395 attempt to read a success variable from the browser context, but no such variable exists there (the assignment on line 379 would have failed).

This test will not work as intended.

🐛 Proposed fix using proper context handling
  test('event-i18n-resources-missed', async ({ page, browserName }) => {
    // firefox dose not support this.
    test.skip(browserName === 'firefox');
    await goto(page);
-   let success = false;
    await page.evaluate(() => {
+     (window as any).success = false;
      (document.querySelector('lynx-view') as LynxViewElement).addEventListener(
        'i18nResourceMissed',
        (event) => {
-         // @ts-expect-error
          if (event.detail.channel === '2') {
-           success = true;
+           (window as any).success = true;
          }
        },
      );
    });
    await page.evaluate(() => {
      globalThis.runtime.renderPage = () => {};
      globalThis.runtime._I18nResourceTranslation({
        locale: 'en',
        channel: '2',
        fallback_url: '',
      });
    });
    await wait(500);
-   success = await page.evaluate<boolean>(() => {
-     return success;
-   });
+   const success = await page.evaluate<boolean>(() => {
+     return (window as any).success;
+   });
    expect(success).toBeTruthy();
  });

Alternatively, use a more robust pattern with CustomEvent detail typing:

const success = await page.evaluate(() => {
  return new Promise<boolean>((resolve) => {
    const timeout = setTimeout(() => resolve(false), 1000);
    (document.querySelector('lynx-view') as LynxViewElement).addEventListener(
      'i18nResourceMissed',
      (event: any) => {
        if (event.detail.channel === '2') {
          clearTimeout(timeout);
          resolve(true);
        }
      },
      { once: true }
    );
    globalThis.runtime.renderPage = () => {};
    globalThis.runtime._I18nResourceTranslation({
      locale: 'en',
      channel: '2',
      fallback_url: '',
    });
  });
});
expect(success).toBeTruthy();
packages/web-platform/web-elements/src/element-reactive/component.ts (1)

327-345: Critical bug: Missing per-listener count decrement in removeEventListener.

The removeEventListener method only handles the case when currentListenerCount === 1 (lines 340-343), but never decrements the count when it's greater than 1. This causes several issues:

  1. Count mismatch: addEventListener increments counts on every call, but removeEventListener only decrements when count is exactly 1
  2. Stuck handlers: Event status handlers never receive the false state because disableEvent is never called
  3. Memory leak: WeakMap entries are never cleaned up for listeners registered multiple times

Example scenario:

element.addEventListener('click', handler); // count: 1
element.addEventListener('click', handler); // count: 2, per-listener: 2
element.removeEventListener('click', handler); // per-listener still 2, no decrement!
element.removeEventListener('click', handler); // per-listener still 2, never calls disableEvent
🐛 Proposed fix
 override removeEventListener(
   type: string,
   listener: EventListener,
   options?: AddEventListenerOptions | boolean,
 ): void {
   super.removeEventListener(type, listener, options);
   const capture = typeof options === 'object' ? options.capture : options;
   const targetEventInfo = this.#eventListenerMap[type];
   if (targetEventInfo && targetEventInfo.count > 0) {
     const targetMap = capture
       ? targetEventInfo.captureListenerCount
       : targetEventInfo.listenerCount;
     const currentListenerCount = targetMap.get(listener);
-    if (currentListenerCount === 1) {
-      targetMap.delete(listener);
-      this.disableEvent(type);
+    if (currentListenerCount && currentListenerCount > 0) {
+      const newCount = currentListenerCount - 1;
+      if (newCount === 0) {
+        targetMap.delete(listener);
+        this.disableEvent(type);
+      } else {
+        targetMap.set(listener, newCount);
+      }
     }
   }
 }
🤖 Fix all issues with AI agents
In @.changeset/wide-views-admire.md:
- Line 5: Update the changeset text to correct the typos: replace "intergrate"
with "integrate" and change "Not we intergrated" to "Now we integrated" in the
.changeset/wide-views-admire.md content so release notes read correctly; search
for the exact misspelled tokens "intergrate" and "intergrated" to locate and
update them in the file.
🧹 Nitpick comments (5)
packages/web-platform/web-elements/tests/fixtures/component-event-test.html (2)

10-12: Remove unused destructured variable.

registerEventEnableStatusChangeHandler is destructured from globalThis but never used in this file.

♻️ Suggested fix
-    const { Component, registerEventEnableStatusChangeHandler } =
-        globalThis;
+    const { Component } = globalThis;

14-75: Remove unused classes and development notes.

EventTracker (lines 14-16) and EventTrackerImpl (lines 44-54) are defined but never used. The extensive comments (lines 17-43, 56-75) read like development notes rather than documentation. Consider keeping only a brief comment explaining the manual decorator simulation approach, and remove the unused code.

♻️ Suggested cleanup
     const { Component } = globalThis;

-      class EventTracker {
-        static observedAttributes = [];
-      }
-      // Apply decorator manually since we are in potentially non-transpiled JS or simpler env
-      // But decorators usually need transpilation.
-      // Actually, since this is running in browser via simple script tag, we can't use TS decorators directly unless we use the return value of registerEventEnableStatusChangeHandler as a function wrapper if it supports it, OR we just use the prototype manipulation if the decorator helper is available.
-      // Wait, the previous code used TS decorators.
-      // `registerEventEnableStatusChangeHandler` is a function that returns a decorator.
-
-      // Let's check how registerEventEnableStatusChangeHandler is implemented.
-      // distinct from the TS decorator, we might need to apply it manually.
-
-      // Let's implement it in a way that works in browser JS (if the build supports it).
-      // Since main.js is built from shell-project.ts which includes the libs.
-
-      // The decorator implementation:
-      // export const registerEventEnableStatusChangeHandler = generateRegister<...>(...);
-      // generateRegister returns a decorator function (target, context) => ...
-
-      // In TS 5.0 decorators are functions. In legacy experiment decorators they are also functions.
-
-      // However, writing raw ES classes in HTML script tag means no TS compilation.
-      // We can simulate what the decorator does or just define the reactive class structure manually if we know it.
-
-      // Looking at `component.ts`:
-      // `Component` takes (tag, attributeReactiveClassesOptional, template).
-      // `AttributeReactiveClass` expects `observedAttributes`, `eventStatusChangedHandler` etc.
-
-      // So we can define the class directly without decorators if we construct the metadata manually.
-
-      class EventTrackerImpl {
-        static observedAttributes = [];
-        static eventStatusChangedHandler = {
-          'custom-event': function(status, type) {
-            if (!window.eventEvents) {
-              window.eventEvents = [];
-            }
-            window.eventEvents.push({ type, status });
-          },
-        };
-      }
-
-      // Logic from `registerEventStatusChangedHandler.ts` -> `generateRegister`
-      // It basically registers the handler to a static `eventStatusChangedHandler` map or similar?
-      // Actually `generateRegister` creates a method decorator.
-
-      // If we look at `component.ts`:
-      // export type AttributeReactiveObject = {
-      //   eventStatusChangedHandler?: Record<string, EventStatusChangeHandler>;
-      // ...
-      // }
-
-      // And `Component` uses `new oneClass(this)`.
-
-      // So the instances of `EventTracker` need to have `eventStatusChangedHandler`.
-      // Or the class `EventTracker` needs to have the static metadata if `Component` reads it from static?
-
-      // `component.ts`:
-      // 296: const handler = oneReactive.eventStatusChangedHandler?.[type];
-
-      // So `oneReactive` (instance of AttributeReactiveClass) must have `eventStatusChangedHandler` property.
-
+      // Manually construct the reactive class to simulate decorator behavior in non-transpiled JS
       class EventTrackerManual {
packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts (2)

267-267: Consider using strict equality for console message assertions.

The change from message.text() === 'green' to message.text().includes('green') reduces assertion precision and could cause false positives if unrelated messages contain these substrings. Unless the message format varies (e.g., includes prefixes or additional formatting), strict equality checks are more reliable for test assertions.

Consider reverting to strict equality if message format is consistent
-if (message.text().includes('green')) {
+if (message.text() === 'green') {
  successCallback = true;
}
-if (message.text().includes('LYNX-VIEW')) {
+if (message.text() === 'LYNX-VIEW') {
  successCallback2 = true;
}

Also applies to: 270-270, 298-301


276-277: Consider defining types for dynamic runtime properties.

The @ts-expect-error suppressions for accessing dynamic napiLoaderOnRT${id} properties are acceptable for runtime-injected values, but consider defining a proper interface extension for globalThis to avoid type suppressions and improve IDE support.

Example type definition to avoid suppressions
declare global {
  interface Window {
    [key: `napiLoaderOnRT${string}`]: {
      load: (module: string) => any;
    };
  }
}

Also applies to: 307-308, 336-339

.changeset/wide-views-admire.md (1)

7-7: Consider using a proper heading instead of bold emphasis.

Line 7 uses bold text for "This is a BREAKING CHANGE" instead of a proper Markdown heading. While this works, using a heading (e.g., ## This is a BREAKING CHANGE) would be more semantically correct.

📜 Review details

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 3168843 and 7506b88.

📒 Files selected for processing (31)
  • .changeset/wide-views-admire.md
  • packages/web-platform/web-core-wasm-e2e/tests/utils.ts
  • packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
  • packages/web-platform/web-core-wasm/css/in_shadow.css
  • packages/web-platform/web-core-wasm/css/linear.css
  • packages/web-platform/web-elements/elements.css
  • packages/web-platform/web-elements/index.css
  • packages/web-platform/web-elements/package.json
  • packages/web-platform/web-elements/src/compat/LinearContainer/LinearContainer.ts
  • packages/web-platform/web-elements/src/compat/LinearContainer/linear-compat.css
  • packages/web-platform/web-elements/src/compat/index.ts
  • packages/web-platform/web-elements/src/element-reactive/component.ts
  • packages/web-platform/web-elements/src/elements/ScrollView/ScrollView.ts
  • packages/web-platform/web-elements/src/elements/XFoldViewNg/XFoldviewHeaderNg.ts
  • packages/web-platform/web-elements/src/elements/XFoldViewNg/XFoldviewNg.ts
  • packages/web-platform/web-elements/src/elements/XFoldViewNg/XFoldviewSlotDragNg.ts
  • packages/web-platform/web-elements/src/elements/XFoldViewNg/XFoldviewSlotNg.ts
  • packages/web-platform/web-elements/src/elements/XFoldViewNg/XFoldviewToolbarNg.ts
  • packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshFooter.ts
  • packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshHeader.ts
  • packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshView.ts
  • packages/web-platform/web-elements/src/elements/XSwiper/SwiperItem.ts
  • packages/web-platform/web-elements/src/elements/XView/XView.ts
  • packages/web-platform/web-elements/src/elements/XViewpagerNg/XViewpagerItemNg.ts
  • packages/web-platform/web-elements/src/elements/XViewpagerNg/XViewpagerNg.ts
  • packages/web-platform/web-elements/src/elements/common-css/linear.css
  • packages/web-platform/web-elements/tests/component-event.spec.ts
  • packages/web-platform/web-elements/tests/fixtures/component-event-test.html
  • packages/web-platform/web-elements/tests/fixtures/shell-project.ts
  • packages/web-platform/web-tests/shell-project/lynx-view.ts
  • packages/web-platform/web-tests/shell-project/web-core.ts
💤 Files with no reviewable changes (7)
  • packages/web-platform/web-elements/package.json
  • packages/web-platform/web-elements/src/elements/common-css/linear.css
  • packages/web-platform/web-tests/shell-project/web-core.ts
  • packages/web-platform/web-core-wasm-e2e/tests/utils.ts
  • packages/web-platform/web-core-wasm/css/linear.css
  • packages/web-platform/web-elements/elements.css
  • packages/web-platform/web-tests/shell-project/lynx-view.ts
🚧 Files skipped from review as they are similar to previous changes (12)
  • packages/web-platform/web-elements/src/elements/XViewpagerNg/XViewpagerNg.ts
  • packages/web-platform/web-elements/src/elements/XFoldViewNg/XFoldviewNg.ts
  • packages/web-platform/web-elements/src/elements/XSwiper/SwiperItem.ts
  • packages/web-platform/web-elements/src/compat/index.ts
  • packages/web-platform/web-core-wasm/css/in_shadow.css
  • packages/web-platform/web-elements/src/elements/XViewpagerNg/XViewpagerItemNg.ts
  • packages/web-platform/web-elements/tests/component-event.spec.ts
  • packages/web-platform/web-elements/index.css
  • packages/web-platform/web-elements/src/elements/XFoldViewNg/XFoldviewSlotNg.ts
  • packages/web-platform/web-elements/tests/fixtures/shell-project.ts
  • packages/web-platform/web-elements/src/elements/ScrollView/ScrollView.ts
  • packages/web-platform/web-elements/src/elements/XView/XView.ts
🧰 Additional context used
📓 Path-based instructions (5)
**/*.{ts,tsx}

📄 CodeRabbit inference engine (AGENTS.md)

Use TypeScript in strict mode with the configuration specified in tsconfig.json

Files:

  • packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshFooter.ts
  • packages/web-platform/web-elements/src/elements/XFoldViewNg/XFoldviewToolbarNg.ts
  • packages/web-platform/web-elements/src/compat/LinearContainer/LinearContainer.ts
  • packages/web-platform/web-elements/src/elements/XFoldViewNg/XFoldviewSlotDragNg.ts
  • packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshView.ts
  • packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshHeader.ts
  • packages/web-platform/web-elements/src/elements/XFoldViewNg/XFoldviewHeaderNg.ts
  • packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
  • packages/web-platform/web-elements/src/element-reactive/component.ts
**/*.{js,ts,tsx}

📄 CodeRabbit inference engine (AGENTS.md)

**/*.{js,ts,tsx}: Follow eslint rules as configured in eslint.config.js including React and TypeScript specific rules
Follow code formatting rules specified in .dprint.jsonc and biome.jsonc

Files:

  • packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshFooter.ts
  • packages/web-platform/web-elements/src/elements/XFoldViewNg/XFoldviewToolbarNg.ts
  • packages/web-platform/web-elements/src/compat/LinearContainer/LinearContainer.ts
  • packages/web-platform/web-elements/src/elements/XFoldViewNg/XFoldviewSlotDragNg.ts
  • packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshView.ts
  • packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshHeader.ts
  • packages/web-platform/web-elements/src/elements/XFoldViewNg/XFoldviewHeaderNg.ts
  • packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
  • packages/web-platform/web-elements/src/element-reactive/component.ts
packages/web-platform/web-elements/src/elements/**/*.ts

📄 CodeRabbit inference engine (packages/web-platform/web-elements/AGENTS.md)

packages/web-platform/web-elements/src/elements/**/*.ts: When creating new elements, inherit from Element via Component decorator and use reactive utilities provided by element-reactive
Use boostedQueueMicrotask for DOM reads/writes to avoid synchronous layout thrashing when accurate layout info isn't immediately needed
Do NOT implement attribute handlers decorated with @registerAttributeHandler directly on the main Element class decorated with @Component. Create a separate Attribute Class implementing AttributeReactiveClass logic and pass it as the second argument to the @Component decorator
Add boolean-like attributes that should not be filtered when set to 'false' string to the static readonly notToFilterFalseAttributes Set in the component class
Use genDomGetter to safely access internal elements within the Shadow DOM
When implementing a new web element, use PascalCase for class names (e.g., MyElement) and kebab-case for tag names, prefixing single-word names with x- (e.g., x-view, scroll-view)
Minimize heavy computation in attributeChangedCallback as these elements run on the main thread
Group DOM updates to minimize layout thrashing in web component implementations

Files:

  • packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshFooter.ts
  • packages/web-platform/web-elements/src/elements/XFoldViewNg/XFoldviewToolbarNg.ts
  • packages/web-platform/web-elements/src/elements/XFoldViewNg/XFoldviewSlotDragNg.ts
  • packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshView.ts
  • packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshHeader.ts
  • packages/web-platform/web-elements/src/elements/XFoldViewNg/XFoldviewHeaderNg.ts
packages/web-platform/web-elements/src/**/*.css

📄 CodeRabbit inference engine (packages/web-platform/web-elements/AGENTS.md)

packages/web-platform/web-elements/src/**/*.css: Respect existing polyfills in src/compat and check browser support before using bleeding-edge CSS features
Use custom CSS properties to control linear layout behavior: --lynx-display: linear, --lynx-linear-orientation, --lynx-linear-weight, --lynx-linear-weight-sum, and --lynx-linear-weight-basis

Files:

  • packages/web-platform/web-elements/src/compat/LinearContainer/linear-compat.css
packages/web-platform/web-elements/tests/fixtures/**/*.html

📄 CodeRabbit inference engine (packages/web-platform/web-elements/AGENTS.md)

Use HTML files for test fixtures and define a helper function goto(page, fixtureName) to handle navigation and waiting for resources like document.fonts.ready

Files:

  • packages/web-platform/web-elements/tests/fixtures/component-event-test.html
🧠 Learnings (50)
📓 Common learnings
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-elements/AGENTS.md:0-0
Timestamp: 2025-12-29T11:26:09.502Z
Learning: Applies to packages/web-platform/web-elements/src/**/*.css : Use custom CSS properties to control linear layout behavior: `--lynx-display: linear`, `--lynx-linear-orientation`, `--lynx-linear-weight`, `--lynx-linear-weight-sum`, and `--lynx-linear-weight-basis`
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-elements/AGENTS.md:0-0
Timestamp: 2025-12-29T11:26:09.502Z
Learning: The `web-elements` package provides a Native UI implementation for the LynxJS Web Platform using Web Components built on the `element-reactive` reactive framework
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-elements/AGENTS.md:0-0
Timestamp: 2025-12-29T11:26:09.502Z
Learning: Applies to packages/web-platform/web-elements/src/**/*.css : Respect existing polyfills in `src/compat` and check browser support before using bleeding-edge CSS features
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-elements/AGENTS.md:0-0
Timestamp: 2025-12-29T11:26:09.502Z
Learning: Applies to packages/web-platform/web-elements/src/elements/**/*.ts : Group DOM updates to minimize layout thrashing in web component implementations
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-elements/AGENTS.md:0-0
Timestamp: 2025-12-29T11:26:09.502Z
Learning: Applies to packages/web-platform/web-elements/tests/**/*.spec.ts : Create a separate spec file for new components (e.g., `tests/x-webview.spec.ts`) instead of adding to the monolithic `web-elements.spec.ts`
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-elements/AGENTS.md:0-0
Timestamp: 2025-12-29T11:26:09.502Z
Learning: Applies to packages/web-platform/web-elements/src/elements/**/*.ts : When creating new elements, inherit from `Element` via `Component` decorator and use reactive utilities provided by `element-reactive`
📚 Learning: 2025-12-29T11:26:09.502Z
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-elements/AGENTS.md:0-0
Timestamp: 2025-12-29T11:26:09.502Z
Learning: Applies to packages/web-platform/web-elements/src/elements/**/*.ts : When creating new elements, inherit from `Element` via `Component` decorator and use reactive utilities provided by `element-reactive`

Applied to files:

  • packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshFooter.ts
  • packages/web-platform/web-elements/src/elements/XFoldViewNg/XFoldviewToolbarNg.ts
  • packages/web-platform/web-elements/src/compat/LinearContainer/LinearContainer.ts
  • packages/web-platform/web-elements/src/elements/XFoldViewNg/XFoldviewSlotDragNg.ts
  • packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshView.ts
  • packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshHeader.ts
  • packages/web-platform/web-elements/src/elements/XFoldViewNg/XFoldviewHeaderNg.ts
  • packages/web-platform/web-elements/tests/fixtures/component-event-test.html
  • packages/web-platform/web-elements/src/element-reactive/component.ts
📚 Learning: 2025-12-29T11:26:09.502Z
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-elements/AGENTS.md:0-0
Timestamp: 2025-12-29T11:26:09.502Z
Learning: Applies to packages/web-platform/web-elements/src/elements/all.ts : Export new components in `src/elements/all.ts` and add export configuration to `package.json` under `exports` for both types and default

Applied to files:

  • packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshFooter.ts
  • packages/web-platform/web-elements/src/elements/XFoldViewNg/XFoldviewToolbarNg.ts
  • packages/web-platform/web-elements/src/compat/LinearContainer/LinearContainer.ts
  • packages/web-platform/web-elements/src/elements/XFoldViewNg/XFoldviewSlotDragNg.ts
  • packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshView.ts
  • packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshHeader.ts
  • packages/web-platform/web-elements/src/elements/XFoldViewNg/XFoldviewHeaderNg.ts
  • packages/web-platform/web-elements/tests/fixtures/component-event-test.html
  • packages/web-platform/web-elements/src/element-reactive/component.ts
📚 Learning: 2025-12-29T11:26:09.502Z
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-elements/AGENTS.md:0-0
Timestamp: 2025-12-29T11:26:09.502Z
Learning: Applies to packages/web-platform/web-elements/src/elements/**/index.ts : Ensure `index.ts` files and complex logic have clear, descriptive comments matching the implementation

Applied to files:

  • packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshFooter.ts
  • packages/web-platform/web-elements/src/elements/XFoldViewNg/XFoldviewToolbarNg.ts
  • packages/web-platform/web-elements/src/compat/LinearContainer/LinearContainer.ts
  • packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshView.ts
  • packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshHeader.ts
  • packages/web-platform/web-elements/tests/fixtures/component-event-test.html
  • .changeset/wide-views-admire.md
📚 Learning: 2025-12-29T11:26:09.502Z
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-elements/AGENTS.md:0-0
Timestamp: 2025-12-29T11:26:09.502Z
Learning: Applies to packages/web-platform/web-elements/src/elements/**/*.ts : Group DOM updates to minimize layout thrashing in web component implementations

Applied to files:

  • packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshFooter.ts
  • packages/web-platform/web-elements/src/elements/XFoldViewNg/XFoldviewToolbarNg.ts
  • packages/web-platform/web-elements/src/compat/LinearContainer/LinearContainer.ts
  • packages/web-platform/web-elements/src/elements/XFoldViewNg/XFoldviewSlotDragNg.ts
  • packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshView.ts
  • packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshHeader.ts
  • packages/web-platform/web-elements/src/compat/LinearContainer/linear-compat.css
  • packages/web-platform/web-elements/src/elements/XFoldViewNg/XFoldviewHeaderNg.ts
  • packages/web-platform/web-elements/tests/fixtures/component-event-test.html
  • packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
  • packages/web-platform/web-elements/src/element-reactive/component.ts
📚 Learning: 2025-12-29T11:26:09.502Z
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-elements/AGENTS.md:0-0
Timestamp: 2025-12-29T11:26:09.502Z
Learning: Applies to packages/web-platform/web-elements/src/elements/**/*.ts : Minimize heavy computation in `attributeChangedCallback` as these elements run on the main thread

Applied to files:

  • packages/web-platform/web-elements/src/elements/XFoldViewNg/XFoldviewToolbarNg.ts
  • packages/web-platform/web-elements/src/compat/LinearContainer/LinearContainer.ts
  • packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshView.ts
  • packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshHeader.ts
  • packages/web-platform/web-elements/tests/fixtures/component-event-test.html
  • packages/web-platform/web-elements/src/element-reactive/component.ts
📚 Learning: 2025-12-29T11:26:09.502Z
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-elements/AGENTS.md:0-0
Timestamp: 2025-12-29T11:26:09.502Z
Learning: Applies to packages/web-platform/web-elements/src/**/*.css : Use custom CSS properties to control linear layout behavior: `--lynx-display: linear`, `--lynx-linear-orientation`, `--lynx-linear-weight`, `--lynx-linear-weight-sum`, and `--lynx-linear-weight-basis`

Applied to files:

  • packages/web-platform/web-elements/src/compat/LinearContainer/LinearContainer.ts
  • packages/web-platform/web-elements/src/compat/LinearContainer/linear-compat.css
  • .changeset/wide-views-admire.md
📚 Learning: 2025-12-29T11:26:09.502Z
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-elements/AGENTS.md:0-0
Timestamp: 2025-12-29T11:26:09.502Z
Learning: Applies to packages/web-platform/web-elements/src/**/*.css : Respect existing polyfills in `src/compat` and check browser support before using bleeding-edge CSS features

Applied to files:

  • packages/web-platform/web-elements/src/compat/LinearContainer/LinearContainer.ts
  • packages/web-platform/web-elements/src/compat/LinearContainer/linear-compat.css
📚 Learning: 2025-09-18T08:12:56.802Z
Learnt from: Sherry-hue
Repo: lynx-family/lynx-stack PR: 1770
File: packages/web-platform/web-mainthread-apis/src/utils/processStyleInfo.ts:316-318
Timestamp: 2025-09-18T08:12:56.802Z
Learning: In packages/web-platform/web-mainthread-apis/src/utils/processStyleInfo.ts, the current implementation uses cardStyleElement.textContent += for lazy component styles. While this could theoretically invalidate rule indices by reparsing the stylesheet, Sherry-hue indicated that UIDs don't repeat for the same element, making this approach acceptable for now. A future optimization to use separate style elements per entry was discussed but deferred to a separate PR to keep the current lazy bundle PR focused.

Applied to files:

  • packages/web-platform/web-elements/src/compat/LinearContainer/LinearContainer.ts
  • packages/web-platform/web-elements/src/compat/LinearContainer/linear-compat.css
📚 Learning: 2025-12-29T11:26:09.502Z
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-elements/AGENTS.md:0-0
Timestamp: 2025-12-29T11:26:09.502Z
Learning: Applies to packages/web-platform/web-elements/src/elements/{x-input,x-textarea,x-image}/**/*.ts : For `x-input`, `x-textarea`, and `x-image` elements, control styling properties like placeholders and blur radii via attributes (e.g., `placeholder-color`, `blur-radius`) which internally map to CSS variables

Applied to files:

  • packages/web-platform/web-elements/src/compat/LinearContainer/LinearContainer.ts
  • packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshView.ts
📚 Learning: 2025-12-29T11:26:09.502Z
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-elements/AGENTS.md:0-0
Timestamp: 2025-12-29T11:26:09.502Z
Learning: Applies to packages/web-platform/web-elements/src/elements/**/*.ts : Use `boostedQueueMicrotask` for DOM reads/writes to avoid synchronous layout thrashing when accurate layout info isn't immediately needed

Applied to files:

  • packages/web-platform/web-elements/src/compat/LinearContainer/LinearContainer.ts
  • packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
📚 Learning: 2025-12-29T11:26:09.502Z
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-elements/AGENTS.md:0-0
Timestamp: 2025-12-29T11:26:09.502Z
Learning: Applies to packages/web-platform/web-elements/tests/**/*.spec.ts : Create a separate spec file for new components (e.g., `tests/x-webview.spec.ts`) instead of adding to the monolithic `web-elements.spec.ts`

Applied to files:

  • packages/web-platform/web-elements/src/compat/LinearContainer/LinearContainer.ts
  • packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshView.ts
  • packages/web-platform/web-elements/tests/fixtures/component-event-test.html
  • packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
📚 Learning: 2025-12-29T11:26:09.502Z
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-elements/AGENTS.md:0-0
Timestamp: 2025-12-29T11:26:09.502Z
Learning: Applies to packages/web-platform/web-elements/src/elements/**/*.ts : Do NOT implement attribute handlers decorated with `registerAttributeHandler` directly on the main Element class decorated with `Component`. Create a separate Attribute Class implementing `AttributeReactiveClass` logic and pass it as the second argument to the `Component` decorator

Applied to files:

  • packages/web-platform/web-elements/src/compat/LinearContainer/LinearContainer.ts
  • packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshView.ts
  • packages/web-platform/web-elements/tests/fixtures/component-event-test.html
  • packages/web-platform/web-elements/src/element-reactive/component.ts
📚 Learning: 2025-12-29T11:26:09.502Z
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-elements/AGENTS.md:0-0
Timestamp: 2025-12-29T11:26:09.502Z
Learning: The `web-elements` package provides a Native UI implementation for the LynxJS Web Platform using Web Components built on the `element-reactive` reactive framework

Applied to files:

  • packages/web-platform/web-elements/src/compat/LinearContainer/LinearContainer.ts
  • .changeset/wide-views-admire.md
📚 Learning: 2025-12-29T11:26:09.502Z
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-elements/AGENTS.md:0-0
Timestamp: 2025-12-29T11:26:09.502Z
Learning: Applies to packages/web-platform/web-elements/src/elements/**/*.ts : Add boolean-like attributes that should not be filtered when set to 'false' string to the `static readonly notToFilterFalseAttributes` Set in the component class

Applied to files:

  • packages/web-platform/web-elements/src/compat/LinearContainer/LinearContainer.ts
  • packages/web-platform/web-elements/src/element-reactive/component.ts
📚 Learning: 2025-12-29T11:26:09.502Z
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-elements/AGENTS.md:0-0
Timestamp: 2025-12-29T11:26:09.502Z
Learning: Use extensive CSS variables (e.g., `--lynx-display`) to drive layout and style from the Lynx engine

Applied to files:

  • packages/web-platform/web-elements/src/compat/LinearContainer/linear-compat.css
📚 Learning: 2025-12-29T11:26:09.502Z
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-elements/AGENTS.md:0-0
Timestamp: 2025-12-29T11:26:09.502Z
Learning: Applies to packages/web-platform/web-elements/src/elements/**/*.css : Write element-specific CSS in the element's directory with filename pattern `element-name.css` and import it in `elements.css`

Applied to files:

  • packages/web-platform/web-elements/src/compat/LinearContainer/linear-compat.css
📚 Learning: 2025-09-23T08:54:39.966Z
Learnt from: upupming
Repo: lynx-family/lynx-stack PR: 1670
File: packages/webpack/css-extract-webpack-plugin/test/hotCases/hot/hot-update-json/dual-thread/__snapshot__/index.css:6-8
Timestamp: 2025-09-23T08:54:39.966Z
Learning: In the lynx-stack CSS extract webpack plugin tests, many test fixture CSS files intentionally use invalid CSS syntax like `color: 'red';` with quoted values. The snapshots correctly reflect this invalid CSS from the source fixtures. To fix CSS validation issues, the source fixture files should be updated first, then snapshots regenerated, rather than manually editing snapshots.

Applied to files:

  • packages/web-platform/web-elements/src/compat/LinearContainer/linear-compat.css
  • packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
📚 Learning: 2025-11-03T08:44:10.706Z
Learnt from: Sherry-hue
Repo: lynx-family/lynx-stack PR: 1911
File: packages/web-platform/web-elements/src/XList/ListItemAttributes.ts:24-29
Timestamp: 2025-11-03T08:44:10.706Z
Learning: In packages/web-platform/web-elements/src/XList/ListItemAttributes.ts, the `estimated-main-axis-size-px` attribute handler does not need to validate or guard against invalid/NaN values when parsing - data correctness verification is not required for this attribute.

Applied to files:

  • packages/web-platform/web-elements/src/compat/LinearContainer/linear-compat.css
📚 Learning: 2025-12-29T11:26:09.502Z
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-elements/AGENTS.md:0-0
Timestamp: 2025-12-29T11:26:09.502Z
Learning: Applies to packages/web-platform/web-elements/tests/fixtures/**/*.html : Use HTML files for test fixtures and define a helper function `goto(page, fixtureName)` to handle navigation and waiting for resources like `document.fonts.ready`

Applied to files:

  • packages/web-platform/web-elements/tests/fixtures/component-event-test.html
  • packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
📚 Learning: 2025-10-11T06:16:12.517Z
Learnt from: Sherry-hue
Repo: lynx-family/lynx-stack PR: 1820
File: packages/web-platform/web-tests/tests/react.spec.ts:834-856
Timestamp: 2025-10-11T06:16:12.517Z
Learning: In packages/web-platform/web-tests/tests/react.spec.ts, the tests `basic-bindmouse` and `basic-mts-bindtouchstart` are NOT duplicates despite having similar test structures. They test different event types: `basic-bindmouse` validates mouse events (mousedown, mouseup, mousemove) with mouse-specific properties (button, buttons, x, y, pageX, pageY, clientX, clientY), while `basic-mts-bindtouchstart` validates touch events (touchstart) with touch arrays (touches, targetTouches, changedTouches). The similar test structure is coincidental and follows testing conventions.

Applied to files:

  • packages/web-platform/web-elements/tests/fixtures/component-event-test.html
📚 Learning: 2025-12-29T11:26:09.502Z
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-elements/AGENTS.md:0-0
Timestamp: 2025-12-29T11:26:09.502Z
Learning: Applies to packages/web-platform/web-elements/tests/**/*.spec.ts : Use Playwright for all E2E and functional tests with standard assertions like `expect(locator).toBeVisible()`, `expect(locator).toHaveCSS()`, and `diffScreenShot` for screenshot comparisons

Applied to files:

  • packages/web-platform/web-elements/tests/fixtures/component-event-test.html
  • packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
📚 Learning: 2025-12-29T11:26:09.502Z
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-elements/AGENTS.md:0-0
Timestamp: 2025-12-29T11:26:09.502Z
Learning: Applies to packages/web-platform/web-elements/tests/**/*.spec.ts : When a component makes external requests (e.g., via `iframe` or `fetch`), mock them using `page.route` in Playwright tests to ensure tests are hermetic and fast

Applied to files:

  • packages/web-platform/web-elements/tests/fixtures/component-event-test.html
  • packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
📚 Learning: 2025-08-12T09:32:01.512Z
Learnt from: upupming
Repo: lynx-family/lynx-stack PR: 1370
File: packages/rspeedy/plugin-react/src/entry.ts:237-240
Timestamp: 2025-08-12T09:32:01.512Z
Learning: The events-cache.js functionality for caching events until background threads are ready is manually tested due to the complexity of constructing automated runtime test cases that involve timing, chunk loading, and browser runtime behavior.

Applied to files:

  • packages/web-platform/web-elements/tests/fixtures/component-event-test.html
  • packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
📚 Learning: 2025-12-30T10:02:35.055Z
Learnt from: upupming
Repo: lynx-family/lynx-stack PR: 2081
File: packages/react/runtime/src/alog/elementPAPICall.ts:109-112
Timestamp: 2025-12-30T10:02:35.055Z
Learning: In packages/react/runtime/src/alog/elementPAPICall.ts, the helper APIs `__GetTag` and `__GetElementUniqueID` should always exist when instrumenting FiberElement PAPIs, so defensive checks for their existence are unnecessary.

Applied to files:

  • packages/web-platform/web-elements/tests/fixtures/component-event-test.html
📚 Learning: 2025-08-11T05:57:18.212Z
Learnt from: upupming
Repo: lynx-family/lynx-stack PR: 1305
File: packages/testing-library/testing-environment/src/index.ts:255-258
Timestamp: 2025-08-11T05:57:18.212Z
Learning: In the ReactLynx testing environment (`packages/testing-library/testing-environment/src/index.ts`), the dual assignment pattern `target.console.method = console.method = () => {}` is required for rstest compatibility. This is because rstest provides `console` in an IIFE (Immediately Invoked Function Expression), and both the target and global console need to have these methods defined for proper test execution.

Applied to files:

  • packages/web-platform/web-elements/tests/fixtures/component-event-test.html
  • packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
📚 Learning: 2025-12-26T05:10:01.608Z
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: AGENTS.md:0-0
Timestamp: 2025-12-26T05:10:01.608Z
Learning: Applies to packages/web-platform/web-tests/**/*.{ts,tsx,js} : Use Playwright for E2E tests in packages/web-platform/web-tests/

Applied to files:

  • packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
📚 Learning: 2026-01-04T11:17:23.990Z
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-core-wasm/AGENTS.md:0-0
Timestamp: 2026-01-04T11:17:23.990Z
Learning: When modifying Rust core logic in src/main_thread, ALWAYS add corresponding tests in tests/element-apis.spec.ts to verify the JS-side behavior

Applied to files:

  • packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
📚 Learning: 2025-12-29T11:26:09.502Z
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-elements/AGENTS.md:0-0
Timestamp: 2025-12-29T11:26:09.502Z
Learning: Applies to packages/web-platform/web-elements/tests/**/*.spec.ts : In Playwright tests, access Shadow DOM explicitly using `.shadowRoot` when using `evaluate` or `waitForFunction`, as document.querySelector fails to directly access shadow DOM elements

Applied to files:

  • packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
📚 Learning: 2025-08-27T12:42:01.095Z
Learnt from: upupming
Repo: lynx-family/lynx-stack PR: 1616
File: packages/webpack/cache-events-webpack-plugin/test/cases/not-cache-events/lazy-bundle/index.js:3-3
Timestamp: 2025-08-27T12:42:01.095Z
Learning: In webpack, properties like __webpack_require__.lynx_ce are injected during compilation/build time when webpack processes modules and generates bundles, not at runtime when dynamic imports execute. Tests for such properties don't need to wait for dynamic imports to complete.

Applied to files:

  • packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
📚 Learning: 2025-09-10T10:27:32.903Z
Learnt from: PupilTong
Repo: lynx-family/lynx-stack PR: 1706
File: .github/workflows/test.yml:0-0
Timestamp: 2025-09-10T10:27:32.903Z
Learning: MULTI_THREAD×SSR combination is NYI (Not Yet Implemented) in the Playwright test configuration, which is why it's excluded from the test matrix in .github/workflows/test.yml.

Applied to files:

  • packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
📚 Learning: 2025-08-21T08:46:54.494Z
Learnt from: upupming
Repo: lynx-family/lynx-stack PR: 1370
File: packages/webpack/cache-events-webpack-plugin/src/LynxCacheEventsRuntimeModule.ts:23-27
Timestamp: 2025-08-21T08:46:54.494Z
Learning: In Lynx webpack runtime modules, the team prioritizes performance and simplicity over defensive runtime error handling. They prefer relying on compile-time type safety (TypeScript) rather than adding runtime checks like try-catch blocks or type validation, especially for performance-critical code like cache event setup/cleanup functions.

Applied to files:

  • packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
📚 Learning: 2025-09-28T07:52:03.601Z
Learnt from: Sherry-hue
Repo: lynx-family/lynx-stack PR: 1837
File: packages/web-platform/web-worker-runtime/src/backgroundThread/background-apis/createNativeApp.ts:151-154
Timestamp: 2025-09-28T07:52:03.601Z
Learning: There are two different registerUpdateDataHandler functions in the lynx-stack codebase:
1. Main thread version in packages/web-platform/web-worker-runtime/src/mainThread/crossThreadHandlers/registerUpdateDataHandler.ts takes (mainThreadRpc: Rpc, backgroundThreadRpc: Rpc, runtime: MainThreadGlobalThis)
2. Background thread version in packages/web-platform/web-worker-runtime/src/backgroundThread/background-apis/crossThreadHandlers/registerUpdateDataHandler.ts takes only (rpc: Rpc, tt: any)

Applied to files:

  • packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
📚 Learning: 2025-09-28T07:52:03.601Z
Learnt from: Sherry-hue
Repo: lynx-family/lynx-stack PR: 1837
File: packages/web-platform/web-worker-runtime/src/backgroundThread/background-apis/createNativeApp.ts:151-154
Timestamp: 2025-09-28T07:52:03.601Z
Learning: There are two different registerUpdateDataHandler functions in the lynx-stack codebase:
1. Main thread version in packages/web-platform/web-worker-runtime/src/mainThread/crossThreadHandlers/registerUpdateDataHandler.ts takes (mainThreadRpc: Rpc, backgroundThreadRpc: Rpc, runtime: MainThreadGlobalThis)
2. Background thread version in packages/web-platform/web-worker-runtime/src/backgroundThread/background-apis/crossThreadHandlers/registerUpdateDataHandler.ts takes only (rpc: Rpc, tt: NativeTTObject)

Applied to files:

  • packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
📚 Learning: 2025-10-10T08:22:12.051Z
Learnt from: Sherry-hue
Repo: lynx-family/lynx-stack PR: 1837
File: packages/web-platform/web-mainthread-apis/src/prepareMainThreadAPIs.ts:266-266
Timestamp: 2025-10-10T08:22:12.051Z
Learning: In packages/web-platform/web-mainthread-apis, the handleUpdatedData function returned from prepareMainThreadAPIs is internal-only, used to serve web-core. It does not require public documentation, type exports, or SSR support.

Applied to files:

  • packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
📚 Learning: 2025-09-25T14:03:25.576Z
Learnt from: PupilTong
Repo: lynx-family/lynx-stack PR: 1834
File: packages/web-platform/web-worker-runtime/src/backgroundThread/background-apis/createChunkLoading.ts:162-171
Timestamp: 2025-09-25T14:03:25.576Z
Learning: In the lynx-stack codebase, for loadScriptAsync implementations in createChunkLoading.ts, unhandled promise rejections from readScriptAsync are intentionally not caught - the caller is expected to handle errors rather than the loadScriptAsync method itself invoking the callback with error messages.

Applied to files:

  • packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
📚 Learning: 2025-11-06T01:19:23.670Z
Learnt from: colinaaa
Repo: lynx-family/lynx-stack PR: 1917
File: packages/mcp-servers/devtool-mcp-server/tsconfig.json:8-8
Timestamp: 2025-11-06T01:19:23.670Z
Learning: The lynx-js/devtool-mcp-server package in lynx-family/lynx-stack targets Node.js >=18.19 (specified in its package.json engines), which is different from the root project's requirement of Node.js ^22 || ^24. The package uses "lib": ["ES2024.Promise"] in its tsconfig.json because it manually includes polyfills for Promise.withResolvers while maintaining compatibility with Node.js v18.

Applied to files:

  • packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
📚 Learning: 2025-08-13T11:46:43.737Z
Learnt from: colinaaa
Repo: lynx-family/lynx-stack PR: 1523
File: vitest.config.ts:5-6
Timestamp: 2025-08-13T11:46:43.737Z
Learning: In the lynx-stack codebase, default imports are consistently used for Node.js built-in modules (e.g., `import os from 'node:os'`, `import fs from 'node:fs'`). The TypeScript configuration supports esModuleInterop and allowSyntheticDefaultImports, making default imports the preferred pattern over namespace imports for Node.js built-ins.

Applied to files:

  • packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
📚 Learning: 2025-09-28T08:46:43.177Z
Learnt from: f0rdream
Repo: lynx-family/lynx-stack PR: 1835
File: packages/react/worklet-runtime/src/workletRuntime.ts:52-55
Timestamp: 2025-09-28T08:46:43.177Z
Learning: The legacy worklet path with `_lepusWorkletHash` in `packages/react/worklet-runtime/src/workletRuntime.ts` is preserved for compatibility with MTS (Mini-app Threading Service) that doesn't support Initial Frame Rendering. This path will not be touched in current implementations.

Applied to files:

  • packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
📚 Learning: 2025-08-27T11:37:38.587Z
Learnt from: PupilTong
Repo: lynx-family/lynx-stack PR: 1589
File: packages/web-platform/web-worker-runtime/src/mainThread/startMainThread.ts:36-49
Timestamp: 2025-08-27T11:37:38.587Z
Learning: In web worker script loading (loadScript function), the pattern of calling fetch() before importScripts() is intentional for caching benefits, not redundant networking. The fetch() ensures HTTP caching is utilized before the synchronous importScripts() call.

Applied to files:

  • packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
📚 Learning: 2025-08-29T16:59:22.060Z
Learnt from: PupilTong
Repo: lynx-family/lynx-stack PR: 1235
File: packages/web-platform/web-mainthread-apis/src/crossThreadHandlers/createQueryComponent.ts:33-38
Timestamp: 2025-08-29T16:59:22.060Z
Learning: The processEvalResult method in MainThreadGlobalThis interface should return the processed evaluation result rather than void, as it's used to transform lepusRootChunkExport in the lazy component loading flow.

Applied to files:

  • packages/web-platform/web-core-wasm-e2e/tests/web-core.test.ts
📚 Learning: 2025-12-26T05:10:01.608Z
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: AGENTS.md:0-0
Timestamp: 2025-12-26T05:10:01.608Z
Learning: Applies to packages/react/components/**/*.{ts,tsx} : Optimize component library in packages/react/components/ using ReactLynx syntax

Applied to files:

  • packages/web-platform/web-elements/src/element-reactive/component.ts
📚 Learning: 2025-09-12T09:43:04.847Z
Learnt from: gaoachao
Repo: lynx-family/lynx-stack PR: 1736
File: .changeset/spotty-experts-smoke.md:1-3
Timestamp: 2025-09-12T09:43:04.847Z
Learning: In the lynx-family/lynx-stack repository, empty changeset files (containing only `---\n\n---`) are used for internal changes that modify src/** files but don't require meaningful release notes, such as private package changes or testing-only modifications. This satisfies CI requirements without generating user-facing release notes.

Applied to files:

  • .changeset/wide-views-admire.md
📚 Learning: 2025-09-12T09:43:04.847Z
Learnt from: gaoachao
Repo: lynx-family/lynx-stack PR: 1736
File: .changeset/spotty-experts-smoke.md:1-3
Timestamp: 2025-09-12T09:43:04.847Z
Learning: In the lynx-family/lynx-stack repository, private packages (marked with "private": true in package.json) like lynx-js/react-transform don't require meaningful changeset entries even when their public APIs change, since they are not published externally and only affect internal development.

Applied to files:

  • .changeset/wide-views-admire.md
📚 Learning: 2025-07-22T09:23:07.797Z
Learnt from: colinaaa
Repo: lynx-family/lynx-stack PR: 1330
File: .changeset/olive-animals-attend.md:1-3
Timestamp: 2025-07-22T09:23:07.797Z
Learning: In the lynx-family/lynx-stack repository, changesets are only required for meaningful changes to end-users such as bugfixes and features. Internal/development changes like chores, refactoring, or removing debug info do not need changeset entries.

Applied to files:

  • .changeset/wide-views-admire.md
📚 Learning: 2025-07-22T09:26:16.722Z
Learnt from: colinaaa
Repo: lynx-family/lynx-stack PR: 1330
File: .changeset/olive-animals-attend.md:1-3
Timestamp: 2025-07-22T09:26:16.722Z
Learning: In the lynx-family/lynx-stack repository, CI checks require changesets when files matching the pattern "src/**" are modified (as configured in .changeset/config.json). For internal changes that don't need meaningful changesets, an empty changeset file is used to satisfy the CI requirement while not generating any release notes.

Applied to files:

  • .changeset/wide-views-admire.md
📚 Learning: 2025-08-14T12:54:51.143Z
Learnt from: upupming
Repo: lynx-family/lynx-stack PR: 1370
File: .changeset/brave-melons-add.md:1-7
Timestamp: 2025-08-14T12:54:51.143Z
Learning: In the lynx-family/lynx-stack repository, packages use 0.x.x versioning where minor version bumps indicate breaking changes (not major bumps), following pre-1.0 semantic versioning conventions.

Applied to files:

  • .changeset/wide-views-admire.md
📚 Learning: 2025-12-26T05:10:01.608Z
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: AGENTS.md:0-0
Timestamp: 2025-12-26T05:10:01.608Z
Learning: Use changeset tool with `pnpm changeset` to document changes before contribution

Applied to files:

  • .changeset/wide-views-admire.md
📚 Learning: 2025-08-19T11:25:36.127Z
Learnt from: colinaaa
Repo: lynx-family/lynx-stack PR: 1558
File: .changeset/solid-squids-fall.md:2-2
Timestamp: 2025-08-19T11:25:36.127Z
Learning: In the lynx-family/lynx-stack repository, changesets should use the exact package name from package.json#name, not generic or unscoped names. Each package has its own specific scoped name (e.g., "lynx-js/react-transform" for packages/react/transform).

Applied to files:

  • .changeset/wide-views-admire.md
📚 Learning: 2025-08-13T11:36:12.075Z
Learnt from: colinaaa
Repo: lynx-family/lynx-stack PR: 1523
File: vitest.config.ts:52-72
Timestamp: 2025-08-13T11:36:12.075Z
Learning: The lynx-stack project requires Node.js >=22 as specified in package.json engines, so Node.js compatibility fallbacks for features introduced before v22 are unnecessary.

Applied to files:

  • .changeset/wide-views-admire.md
🧬 Code graph analysis (3)
packages/web-platform/web-elements/src/compat/LinearContainer/LinearContainer.ts (1)
packages/web-platform/web-elements/src/compat/index.ts (1)
  • LinearContainer (1-1)
packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshHeader.ts (9)
packages/web-platform/web-elements/src/elements/XFoldViewNg/XFoldviewNg.ts (1)
  • Component (18-79)
packages/web-platform/web-elements/src/elements/XFoldViewNg/XFoldviewSlotNg.ts (1)
  • Component (12-26)
packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshFooter.ts (1)
  • Component (11-23)
packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshView.ts (1)
  • Component (13-73)
packages/web-platform/web-elements/src/elements/XSwiper/SwiperItem.ts (1)
  • Component (10-14)
packages/web-platform/web-elements/src/elements/XView/XView.ts (1)
  • Component (14-39)
packages/web-platform/web-elements/src/elements/XViewpagerNg/XViewpagerNg.ts (1)
  • Component (16-62)
packages/web-platform/web-elements/src/compat/LinearContainer/LinearContainer.ts (1)
  • LinearContainer (89-91)
packages/web-platform/web-elements/src/compat/index.ts (1)
  • LinearContainer (1-1)
packages/web-platform/web-elements/src/elements/XFoldViewNg/XFoldviewHeaderNg.ts (10)
packages/web-platform/web-elements/src/elements/ScrollView/ScrollView.ts (1)
  • Component (16-116)
packages/web-platform/web-elements/src/elements/XFoldViewNg/XFoldviewSlotNg.ts (1)
  • Component (12-26)
packages/web-platform/web-elements/src/elements/XFoldViewNg/XFoldviewToolbarNg.ts (1)
  • Component (12-32)
packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshFooter.ts (1)
  • Component (11-23)
packages/web-platform/web-elements/src/elements/XRefreshView/XRefreshHeader.ts (1)
  • Component (11-23)
packages/web-platform/web-elements/src/elements/XSwiper/SwiperItem.ts (1)
  • Component (10-14)
packages/web-platform/web-elements/src/elements/XView/XView.ts (1)
  • Component (14-39)
packages/web-platform/web-elements/src/elements/XViewpagerNg/XViewpagerNg.ts (1)
  • Component (16-62)
packages/web-platform/web-elements/src/compat/LinearContainer/LinearContainer.ts (1)
  • LinearContainer (89-91)
packages/web-platform/web-elements/src/compat/index.ts (1)
  • LinearContainer (1-1)
🪛 LanguageTool
.changeset/wide-views-admire.md

[grammar] ~5-~5: Ensure spelling is correct
Context: ...lynx-js/web-elements": minor --- feat: intergrate the LinearContainer Compat plugin **Th...

(QB_NEW_EN_ORTHOGRAPHY_ERROR_IDS_1)


[grammar] ~9-~9: Ensure spelling is correct
Context: ... This is a BREAKING CHANGE Not we intergrated the LinearCompat in the @lynx-js/web-...

(QB_NEW_EN_ORTHOGRAPHY_ERROR_IDS_1)

🪛 markdownlint-cli2 (0.18.1)
.changeset/wide-views-admire.md

7-7: Emphasis used instead of a heading

(MD036, no-emphasis-as-heading)

⏰ 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: test-rust / Test (Ubuntu)
  • GitHub Check: test-rust / rustfmt
  • GitHub Check: test-rust / clippy

Comment thread .changeset/wide-views-admire.md Outdated
@codecov
Copy link
Copy Markdown

codecov Bot commented Jan 8, 2026

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ All tests successful. No failed tests found.

📢 Thoughts on this report? Let us know!

@codspeed-hq
Copy link
Copy Markdown

codspeed-hq Bot commented Jan 8, 2026

CodSpeed Performance Report

Merging this PR will not alter performance

Comparing PupilTong:p/hw/interigrate-web-elements-compat-pkg (0cabea7) with main (afef4ba)

Summary

✅ 63 untouched benchmarks
⏩ 3 skipped benchmarks1

Footnotes

  1. 3 benchmarks were skipped, so the baseline results were used instead. If they were deleted from the codebase, click here and archive them to remove them from the performance reports.

@relativeci
Copy link
Copy Markdown

relativeci Bot commented Jan 8, 2026

Web Explorer

#7096 Bundle Size — 383.14KiB (+0.83%).

0cabea7(current) vs afef4ba main#7092(baseline)

Bundle metrics  Change 5 changes Regression 2 regressions
                 Current
#7096
     Baseline
#7092
Regression  Initial JS 154.03KiB(+0.42%) 153.39KiB
Regression  Initial CSS 35.04KiB(+7.71%) 32.53KiB
Change  Cache Invalidation 48.93% 40.24%
No change  Chunks 8 8
No change  Assets 8 8
Change  Modules 237(+0.42%) 236
No change  Duplicate Modules 16 16
Change  Duplicate Code 3%(-0.99%) 3.03%
No change  Packages 4 4
No change  Duplicate Packages 0 0
Bundle size by type  Change 2 changes Regression 2 regressions
                 Current
#7096
     Baseline
#7092
Regression  JS 251.13KiB (+0.25%) 250.49KiB
No change  Other 96.98KiB 96.98KiB
Regression  CSS 35.04KiB (+7.71%) 32.53KiB

Bundle analysis reportBranch PupilTong:p/hw/interigrate-web-e...Project dashboard


Generated by RelativeCIDocumentationReport issue

Copy link
Copy Markdown
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

🤖 Fix all issues with AI agents
In @.changeset/wide-views-admire.md:
- Line 7: Replace the bold emphasis line "**This is a BREAKING CHANGE**" with a
proper Markdown heading like "### This is a BREAKING CHANGE" so the linter
accepts it; locate the exact bold string in the .changeset entry (the line
containing **This is a BREAKING CHANGE**) and change it to a heading level
(e.g., prepend ### and remove the surrounding **).
📜 Review details

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 7506b88 and 0cabea7.

📒 Files selected for processing (1)
  • .changeset/wide-views-admire.md
🧰 Additional context used
🧠 Learnings (12)
📓 Common learnings
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-elements/AGENTS.md:0-0
Timestamp: 2025-12-29T11:26:09.502Z
Learning: Applies to packages/web-platform/web-elements/src/**/*.css : Use custom CSS properties to control linear layout behavior: `--lynx-display: linear`, `--lynx-linear-orientation`, `--lynx-linear-weight`, `--lynx-linear-weight-sum`, and `--lynx-linear-weight-basis`
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-elements/AGENTS.md:0-0
Timestamp: 2025-12-29T11:26:09.502Z
Learning: Applies to packages/web-platform/web-elements/src/elements/**/*.ts : Group DOM updates to minimize layout thrashing in web component implementations
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: AGENTS.md:0-0
Timestamp: 2025-12-26T05:10:01.608Z
Learning: Applies to packages/react/components/**/*.{ts,tsx} : Optimize component library in packages/react/components/ using ReactLynx syntax
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-elements/AGENTS.md:0-0
Timestamp: 2025-12-29T11:26:09.502Z
Learning: Applies to packages/web-platform/web-elements/src/**/*.css : Respect existing polyfills in `src/compat` and check browser support before using bleeding-edge CSS features
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-elements/AGENTS.md:0-0
Timestamp: 2025-12-29T11:26:09.502Z
Learning: Applies to packages/web-platform/web-elements/src/elements/all.ts : Export new components in `src/elements/all.ts` and add export configuration to `package.json` under `exports` for both types and default
📚 Learning: 2025-09-12T09:43:04.847Z
Learnt from: gaoachao
Repo: lynx-family/lynx-stack PR: 1736
File: .changeset/spotty-experts-smoke.md:1-3
Timestamp: 2025-09-12T09:43:04.847Z
Learning: In the lynx-family/lynx-stack repository, private packages (marked with "private": true in package.json) like lynx-js/react-transform don't require meaningful changeset entries even when their public APIs change, since they are not published externally and only affect internal development.

Applied to files:

  • .changeset/wide-views-admire.md
📚 Learning: 2025-09-12T09:43:04.847Z
Learnt from: gaoachao
Repo: lynx-family/lynx-stack PR: 1736
File: .changeset/spotty-experts-smoke.md:1-3
Timestamp: 2025-09-12T09:43:04.847Z
Learning: In the lynx-family/lynx-stack repository, empty changeset files (containing only `---\n\n---`) are used for internal changes that modify src/** files but don't require meaningful release notes, such as private package changes or testing-only modifications. This satisfies CI requirements without generating user-facing release notes.

Applied to files:

  • .changeset/wide-views-admire.md
📚 Learning: 2025-12-29T11:26:09.502Z
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-elements/AGENTS.md:0-0
Timestamp: 2025-12-29T11:26:09.502Z
Learning: Applies to packages/web-platform/web-elements/src/**/*.css : Use custom CSS properties to control linear layout behavior: `--lynx-display: linear`, `--lynx-linear-orientation`, `--lynx-linear-weight`, `--lynx-linear-weight-sum`, and `--lynx-linear-weight-basis`

Applied to files:

  • .changeset/wide-views-admire.md
📚 Learning: 2025-07-22T09:23:07.797Z
Learnt from: colinaaa
Repo: lynx-family/lynx-stack PR: 1330
File: .changeset/olive-animals-attend.md:1-3
Timestamp: 2025-07-22T09:23:07.797Z
Learning: In the lynx-family/lynx-stack repository, changesets are only required for meaningful changes to end-users such as bugfixes and features. Internal/development changes like chores, refactoring, or removing debug info do not need changeset entries.

Applied to files:

  • .changeset/wide-views-admire.md
📚 Learning: 2025-12-29T11:26:09.502Z
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: packages/web-platform/web-elements/AGENTS.md:0-0
Timestamp: 2025-12-29T11:26:09.502Z
Learning: The `web-elements` package provides a Native UI implementation for the LynxJS Web Platform using Web Components built on the `element-reactive` reactive framework

Applied to files:

  • .changeset/wide-views-admire.md
📚 Learning: 2025-08-14T12:54:51.143Z
Learnt from: upupming
Repo: lynx-family/lynx-stack PR: 1370
File: .changeset/brave-melons-add.md:1-7
Timestamp: 2025-08-14T12:54:51.143Z
Learning: In the lynx-family/lynx-stack repository, packages use 0.x.x versioning where minor version bumps indicate breaking changes (not major bumps), following pre-1.0 semantic versioning conventions.

Applied to files:

  • .changeset/wide-views-admire.md
📚 Learning: 2025-07-22T09:26:16.722Z
Learnt from: colinaaa
Repo: lynx-family/lynx-stack PR: 1330
File: .changeset/olive-animals-attend.md:1-3
Timestamp: 2025-07-22T09:26:16.722Z
Learning: In the lynx-family/lynx-stack repository, CI checks require changesets when files matching the pattern "src/**" are modified (as configured in .changeset/config.json). For internal changes that don't need meaningful changesets, an empty changeset file is used to satisfy the CI requirement while not generating any release notes.

Applied to files:

  • .changeset/wide-views-admire.md
📚 Learning: 2025-12-26T05:10:01.608Z
Learnt from: CR
Repo: lynx-family/lynx-stack PR: 0
File: AGENTS.md:0-0
Timestamp: 2025-12-26T05:10:01.608Z
Learning: Use changeset tool with `pnpm changeset` to document changes before contribution

Applied to files:

  • .changeset/wide-views-admire.md
📚 Learning: 2025-08-07T04:00:59.645Z
Learnt from: colinaaa
Repo: lynx-family/lynx-stack PR: 1454
File: pnpm-workspace.yaml:46-46
Timestamp: 2025-08-07T04:00:59.645Z
Learning: In the lynx-family/lynx-stack repository, the webpack patch (patches/webpack5.101.0.patch) was created to fix issues with webpack5.99.9 but only takes effect on webpack5.100.0 and later versions. The patchedDependencies entry should use "webpack@^5.100.0" to ensure the patch applies to the correct version range.

Applied to files:

  • .changeset/wide-views-admire.md
📚 Learning: 2025-08-19T11:25:36.127Z
Learnt from: colinaaa
Repo: lynx-family/lynx-stack PR: 1558
File: .changeset/solid-squids-fall.md:2-2
Timestamp: 2025-08-19T11:25:36.127Z
Learning: In the lynx-family/lynx-stack repository, changesets should use the exact package name from package.json#name, not generic or unscoped names. Each package has its own specific scoped name (e.g., "lynx-js/react-transform" for packages/react/transform).

Applied to files:

  • .changeset/wide-views-admire.md
📚 Learning: 2025-08-13T11:36:12.075Z
Learnt from: colinaaa
Repo: lynx-family/lynx-stack PR: 1523
File: vitest.config.ts:52-72
Timestamp: 2025-08-13T11:36:12.075Z
Learning: The lynx-stack project requires Node.js >=22 as specified in package.json engines, so Node.js compatibility fallbacks for features introduced before v22 are unnecessary.

Applied to files:

  • .changeset/wide-views-admire.md
🪛 markdownlint-cli2 (0.18.1)
.changeset/wide-views-admire.md

7-7: Emphasis used instead of a heading

(MD036, no-emphasis-as-heading)

⏰ 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). (3)
  • GitHub Check: build / Build (Ubuntu)
  • GitHub Check: build / Build (Windows)
  • GitHub Check: test-rust / Test (Ubuntu)
🔇 Additional comments (1)
.changeset/wide-views-admire.md (1)

1-17: Changeset format and content are appropriate for this breaking change.

The changeset correctly documents the feature integration, marks the breaking change, uses the exact scoped package name (@lynx-js/web-elements), and specifies a minor version bump consistent with 0.x.x versioning conventions for breaking changes. The migration guidance for developers is clear and actionable.

Comment thread .changeset/wide-views-admire.md
@PupilTong PupilTong merged commit fc9e863 into lynx-family:main Jan 8, 2026
45 checks passed
colinaaa pushed a commit that referenced this pull request Jan 11, 2026
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/rspeedy@0.13.0

### Minor Changes

- Bump Rsbuild v1.7.1 with Rspack v1.7.0.
([#2088](#2088))

- **BREAKING CHANGE**: Remove the CLI version selector and the
`--unmanaged` flag.
([#2093](#2093))

Rspeedy will no longer automatically attempt to use the locally
installed version when the CLI is invoked.

    Please uninstall your globally installed version of Rspeedy:

    ```bash
    npm uninstall -g @lynx-js/rspeedy
    ```

### Patch Changes

-   Updated dependencies \[]:
    -   @lynx-js/web-rsbuild-server-middleware@0.19.5

## @lynx-js/web-elements@0.11.0

### Minor Changes

- feat: integrate the LinearContainer Compat plugin
([#2100](#2100))

    **This is a BREAKING CHANGE**

Now we integrated the `LinearCompat` into @lynx-js/web-elements.
Developers can safely remove the following imports:

    ```js
    import "@lynx-js/web-elements/compat/LinearContainer";
    ```

    ```js
    import "@lynx-js/web-elements-compat/LinearContainer";
    ```

### Patch Changes

- fix: list-item `contain` property changes from `size` to `layout
paint`, because the size of the `list-item` can be expanded by its
children. ([#2043](#2043))

- Use the scoped `@lynx-js/source-field` for source build resolution.
([#2096](#2096))

## @lynx-js/react@0.115.4

### Patch Changes

- fix: unable to access `MainThreadRef` in some scenarios
([#1996](#1996))

- Add `getComputedStyleProperty` for `MainThread.Element` to retrieve
computed style values synchronously.
([#2005](#2005))

    **Requires Lynx SDK >= 3.5**

    ```typescript
    function getStyle(ele: MainThread.Element) {
      "main thread";
const width = ele.getComputedStyleProperty("width"); // Returns 300px
const transformMatrix = ele.getComputedStyleProperty("transform"); //
Returns matrix(2, 0, 0, 2, 200, 400)
    }
    ```

## @lynx-js/config-rsbuild-plugin@0.0.1

### Patch Changes

- Init `@lynx-js/config-rsbuild-plugin` for configuring Lynx Configs
that are not exposed by DSL plugins.
([#2052](#2052))

    For example:

    ```ts
    // lynx.config.ts
    import { pluginLynxConfig } from "@lynx-js/config-rsbuild-plugin";
    import { defineConfig } from "@lynx-js/rspeedy";

    export default defineConfig({
      plugins: [
        pluginLynxConfig({
          enableCheckExposureOptimize: false,
        }),
      ],
    });
    ```

## @lynx-js/react-rsbuild-plugin@0.12.5

### Patch Changes

- Support reading config from `pluginLynxConfig`.
([#2054](#2054))

-   Updated dependencies \[]:
    -   @lynx-js/react-alias-rsbuild-plugin@0.12.5
    -   @lynx-js/use-sync-external-store@1.5.0
    -   @lynx-js/react-refresh-webpack-plugin@0.3.4
    -   @lynx-js/react-webpack-plugin@0.7.3

## @lynx-js/web-constants@0.19.5

### Patch Changes

- Updated dependencies
\[[`a91173c`](a91173c)]:
    -   @lynx-js/web-worker-rpc@0.19.5

## @lynx-js/web-core@0.19.5

### Patch Changes

- fix: pixelWidth and pixelHeight use client instead of screen
([#2055](#2055))

- Updated dependencies
\[[`a91173c`](a91173c)]:
    -   @lynx-js/web-worker-rpc@0.19.5
    -   @lynx-js/web-constants@0.19.5
    -   @lynx-js/web-worker-runtime@0.19.5
    -   @lynx-js/web-mainthread-apis@0.19.5

## @lynx-js/web-explorer@0.0.16

### Patch Changes

- fix: add web bundle check && toast error
([#2101](#2101))

- fix: list-item `contain` property changes from `size` to `layout
paint`, because the size of the `list-item` can be expanded by its
children. ([#2043](#2043))

- fix: pixelWidth and pixelHeight use client instead of screen
([#2055](#2055))

## @lynx-js/web-mainthread-apis@0.19.5

### Patch Changes

-   Updated dependencies \[]:
    -   @lynx-js/web-constants@0.19.5

## @lynx-js/web-worker-rpc@0.19.5

### Patch Changes

- Use the scoped `@lynx-js/source-field` for source build resolution.
([#2096](#2096))

## @lynx-js/web-worker-runtime@0.19.5

### Patch Changes

- Updated dependencies
\[[`a91173c`](a91173c)]:
    -   @lynx-js/web-worker-rpc@0.19.5
    -   @lynx-js/web-constants@0.19.5
    -   @lynx-js/web-mainthread-apis@0.19.5

## create-rspeedy@0.13.0



## @lynx-js/react-alias-rsbuild-plugin@0.12.5



## upgrade-rspeedy@0.13.0



## @lynx-js/web-core-server@0.19.5



## @lynx-js/web-rsbuild-server-middleware@0.19.5

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
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