fix(html): avoid menu item value render loop

[sampotts]

Summary

Prevent menu value labels from rewriting identical text during render. This avoids a feedback loop where menu content observation can keep scheduling updates after the label has already settled.

Changes

• Skip same-value textContent writes in menu item values
• Add a regression test that verifies unchanged labels do not produce DOM mutations

Testing

• pnpm -F @videojs/html test src/ui/menu/tests/menu-item-value-element.test.ts
• pnpm exec biome check packages/html/src/ui/menu/menu-item-value-element.ts packages/html/src/ui/menu/tests/menu-item-value-element.test.ts

---

Note

Low Risk
Targeted DOM write and mutation-observer filtering in menu UI; no auth, data, or API surface changes.

Overview
Stops a feedback loop where menu viewport layout kept rescheduling after value labels had already settled.

media-menu-item-value now assigns textContent only when the label string actually changes, so Lit re-renders with the same context label no longer touch the DOM.

observeMenuViewContent ignores attribute mutations whose value is unchanged (using attributeOldValue), while still reacting to child-list changes and real data-availability updates. Tests cover no-op attribute sets, post-cleanup behavior, and zero mutations on unchanged label re-renders.

^{Reviewed by Cursor Bugbot for commit 1eaeb6f. Bugbot is set up for automated code reviews on this repo. Configure here.}

[netlify]

✅ Deploy Preview for vjs10-site ready!

Name	Link
🔨 Latest commit	1eaeb6f
🔍 Latest deploy log	https://app.netlify.com/projects/vjs10-site/deploys/6a45ea1be8b36b0008b60e3c
😎 Deploy Preview	https://deploy-preview-1791--vjs10-site.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.
🤖 Make changes	Run an agent on this branch

---

To edit notification comments on pull requests, go to your Netlify project configuration.

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
v10-sandbox	Ready	Preview, Comment	Jul 2, 2026 4:34am

[github-actions]

📦 Bundle Size Report

🎨 @videojs/html — no changes

Presets (7)

Entry	Initial
/video (default)	46.24 kB
/video (default + hls)	185.87 kB
/video (minimal)	46.25 kB
/video (minimal + hls)	185.90 kB
/audio (default)	39.78 kB
/audio (minimal)	38.93 kB
/background	4.20 kB

Media (10)

Entry	Initial
/media/background-video	1.14 kB
/media/container	1.72 kB
/media/dash-video	214.72 kB
/media/hlsjs-video	141.49 kB
/media/mux-audio	163.89 kB
/media/mux-video	163.96 kB
/media/native-hls-video	9.05 kB
/media/simple-hls-audio-only	17.15 kB
/media/simple-hls-video	18.72 kB
/media/vimeo-video	12.31 kB

Players (5)

Entry	Initial
/video/player	8.22 kB
/audio/player	5.38 kB
/background/player	3.92 kB
/live-video/player	7.64 kB
/live-audio/player	5.39 kB

Skins (30)

Entry	Type	Initial
/video/minimal-skin.css	css	5.65 kB
/video/skin.css	css	5.61 kB
/video/minimal-skin	js	46.21 kB
/video/minimal-skin.tailwind	js	46.93 kB
/video/skin	js	46.24 kB
/video/skin.tailwind	js	47.02 kB
/audio/minimal-skin.css	css	3.93 kB
/audio/skin.css	css	3.82 kB
/audio/minimal-skin	js	38.94 kB
/audio/minimal-skin.tailwind	js	39.43 kB
/audio/skin	js	39.79 kB
/audio/skin.tailwind	js	40.30 kB
/background/skin.css	css	133 B
/background/skin	js	1.14 kB
/live-video/minimal-skin.css	css	5.65 kB
/live-video/skin.css	css	5.61 kB
/live-video/minimal-skin	js	45.25 kB
/live-video/minimal-skin.tailwind	js	45.87 kB
/live-video/skin	js	44.86 kB
/live-video/skin.tailwind	js	45.52 kB
/live-audio/minimal-skin.css	css	3.93 kB
/live-audio/skin.css	css	3.82 kB
/live-audio/minimal-skin	js	31.54 kB
/live-audio/minimal-skin.tailwind	js	30.98 kB
/live-audio/skin	js	32.54 kB
/live-audio/skin.tailwind	js	32.01 kB
/global.css	css	176 B
/shared.css	css	104 B
/tailwind.css	css	161 B
/skin-element	js	1.45 kB

UI Components (39)

Entry	Initial
/ui/airplay-button	2.41 kB
/ui/alert-dialog	2.55 kB
/ui/alert-dialog-close	2.17 kB
/ui/alert-dialog-description	2.11 kB
/ui/alert-dialog-title	2.16 kB
/ui/audio-track-radio-group	2.84 kB
/ui/buffering-indicator	2.28 kB
/ui/captions-button	2.40 kB
/ui/captions-radio-group	2.84 kB
/ui/cast-button	2.42 kB
/ui/compounds	2.85 kB
/ui/controls	2.59 kB
/ui/error-dialog	2.60 kB
/ui/fullscreen-button	2.36 kB
/ui/hotkey	2.32 kB
/ui/menu	2.66 kB
/ui/mute-button	2.45 kB
/ui/pip-button	2.39 kB
/ui/play-button	2.39 kB
/ui/playback-rate-button	2.45 kB
/ui/playback-rate-radio-group	2.77 kB
/ui/popover	2.74 kB
/ui/poster	2.24 kB
/ui/quality-radio-group	2.82 kB
/ui/seek-button	2.41 kB
/ui/seek-indicator	2.43 kB
/ui/seek-indicator-value	418 B
/ui/slider	2.63 kB
/ui/status-announcer	2.32 kB
/ui/status-indicator	2.38 kB
/ui/status-indicator-value	422 B
/ui/thumbnail	2.21 kB
/ui/time	2.60 kB
/ui/time-slider	2.64 kB
/ui/tooltip	2.67 kB
/ui/volume-indicator	2.34 kB
/ui/volume-indicator-fill	444 B
/ui/volume-indicator-value	366 B
/ui/volume-slider	2.63 kB

Sizes are marginal over the root entry point.

⚛️ @videojs/react — no changes

Presets (7)

Entry	Initial
/video (default)	38.33 kB
/video (default + hls)	176.58 kB
/video (minimal)	38.69 kB
/video (minimal + hls)	177.08 kB
/audio (default)	31.54 kB
/audio (minimal)	31.61 kB
/background	754 B

Media (9)

Entry	Initial
/media/background-video	575 B
/media/dash-video	213.16 kB
/media/hlsjs-video	140.07 kB
/media/mux-audio	162.52 kB
/media/mux-video	162.57 kB
/media/native-hls-video	7.41 kB
/media/simple-hls-audio-only	15.56 kB
/media/simple-hls-video	17.14 kB
/media/vimeo-video	10.58 kB

Skins (27)

Entry	Type	Initial
/tailwind.css	css	161 B
/video/minimal-skin.css	css	5.55 kB
/video/skin.css	css	5.52 kB
/video/minimal-skin	js	38.65 kB
/video/minimal-skin.tailwind	js	44.67 kB
/video/skin	js	38.25 kB
/video/skin.tailwind	js	44.31 kB
/audio/minimal-skin.css	css	3.79 kB
/audio/skin.css	css	3.68 kB
/audio/minimal-skin	js	31.56 kB
/audio/minimal-skin.tailwind	js	33.75 kB
/audio/skin	js	31.48 kB
/audio/skin.tailwind	js	35.73 kB
/background/skin.css	css	90 B
/background/skin	js	272 B
/live-video/minimal-skin.css	css	5.55 kB
/live-video/skin.css	css	5.52 kB
/live-video/minimal-skin	js	33.42 kB
/live-video/minimal-skin.tailwind	js	39.37 kB
/live-video/skin	js	33.43 kB
/live-video/skin.tailwind	js	39.43 kB
/live-audio/minimal-skin.css	css	3.79 kB
/live-audio/skin.css	css	3.68 kB
/live-audio/minimal-skin	js	22.45 kB
/live-audio/minimal-skin.tailwind	js	25.59 kB
/live-audio/skin	js	22.52 kB
/live-audio/skin.tailwind	js	25.65 kB

UI Components (33)

Entry	Initial
/ui/airplay-button	2.22 kB
/ui/alert-dialog	2.16 kB
/ui/audio-track	2.14 kB
/ui/buffering-indicator	2.13 kB
/ui/captions-button	2.23 kB
/ui/captions-radio-group	2.11 kB
/ui/cast-button	2.20 kB
/ui/controls	2.06 kB
/ui/error-dialog	2.27 kB
/ui/fullscreen-button	2.21 kB
/ui/gesture	2.29 kB
/ui/hotkey	2.21 kB
/ui/live-button	2.15 kB
/ui/menu	2.29 kB
/ui/mute-button	2.24 kB
/ui/pip-button	2.23 kB
/ui/play-button	2.22 kB
/ui/playback-rate	2.13 kB
/ui/playback-rate-button	2.22 kB
/ui/popover	2.67 kB
/ui/poster	2.03 kB
/ui/quality	2.08 kB
/ui/seek-button	2.22 kB
/ui/seek-indicator	2.10 kB
/ui/slider	2.27 kB
/ui/status-announcer	2.16 kB
/ui/status-indicator	2.09 kB
/ui/thumbnail	2.03 kB
/ui/time	2.08 kB
/ui/time-slider	2.22 kB
/ui/tooltip	2.63 kB
/ui/volume-indicator	2.09 kB
/ui/volume-slider	2.21 kB

Sizes are marginal over the root entry point.

🧩 @videojs/core — no changes

Entries (14)

Entry	Initial
.	9.40 kB
/dom	17.58 kB
/dom/media/custom-media-element	2.09 kB
/dom/media/dash	208.96 kB
/dom/media/google-cast	4.04 kB
/dom/media/hls-js	136.00 kB
/dom/media/media-host	1.25 kB
/dom/media/media-played-ranges	576 B
/dom/media/mux	151.26 kB
/dom/media/native-hls	3.07 kB
/dom/media/simple-hls	16.49 kB
/dom/media/simple-hls-audio-only	14.92 kB
/dom/media/vimeo	9.86 kB
/media/predicate	563 B

🏷️ @videojs/element — no changes

Entries (2)

Entry	Initial
.	996 B
/context	943 B

📦 @videojs/store — no changes

Entries (3)

Entry	Initial
.	1.39 kB
/html	696 B
/react	360 B

🔧 @videojs/utils — no changes

Entries (10)

Entry	Initial
/array	104 B
/dom	2.26 kB
/events	319 B
/function	327 B
/object	275 B
/predicate	265 B
/string	231 B
/style	190 B
/time	478 B
/number	158 B

📦 @videojs/spf — no changes

Entries (4)

Entry	Initial
.	4.45 kB
/dom	6.33 kB
/hls	15.37 kB
/background-video	12.85 kB

---

ℹ️ How to interpret

JS sizes are initial static graph totals (minified + brotli). Lazy dynamic chunks are shown separately when present.

Icon	Meaning
✅	No change
🔺	Increased ≤ 10%
🔴	Increased > 10%
🔽	Decreased
🆕	New (no baseline)

Run pnpm size locally to check current initial sizes.