fix(dash): [PKG-DASH-05] synchronize SDK events and own refresh lifecycle

packages/artplayer-plugin-dash-control/ARCHITECTURE.md

@@ -12,6 +12,8 @@ destroys it, changes its source, or adds a runtime dependency on dash.js.
 | ------------------------------------------ | --------------------------------------------------------------------------------------- |
 | `src/index.ts`                             | Deferred installation, media identity, update revisions, event subscription and cleanup |
 | `src/sdk.ts`                               | 4.x qualityIndex vs 5.x representation ID access and manual/Auto selection              |
+| `src/sdk-events.ts`                        | Owned SDK subscriptions, coalesced refresh, teardown and asynchronous errors             |
+| `src/types.ts`                             | Narrow internal SDK, host, model and cleanup types                                        |
 | `src/mapping.ts`                           | Names, current item matching, duplicate labels and selector ordering                    |
 | `src/menu.ts`                              | Existing control/setting registries, menu ownership and guarded selection callbacks     |
 | `src/audio.svg`, `src/quality.svg`         | Existing setting icons                                                                  |
@@ -19,7 +21,8 @@ destroys it, changes its source, or adds a runtime dependency on dash.js.
 
 Dependencies flow from the entry into mapping/menu, and from mapping into the SDK
 adapter. Mapping has no DOM dependency. Menu receives a model and validity callback;
-it does not choose SDK versions. All five owned modules are checked with strict
+it does not choose SDK versions. The event observer receives active/refresh/reset
+callbacks and owns no DOM or ArtPlayer object. All six owned modules are checked with strict
 TypeScript, noUncheckedIndexedAccess, and skipLibCheck=false; there are no remaining
 owned JavaScript modules in this package.
 
@@ -56,6 +59,29 @@ Keep `dash-quality`/`dash-audio`, selector shape, right control placement/paddin
 setting width/icons, defaults and unbound getName calls compatible. Do not use a
 filtered representation array index or absoluteIndex as the SDK 5 selection key.
 
+## SDK-driven refresh
+
+After media identity validation, bind seven listeners only when both SDK `on` and
+`off` exist. Quality requested/rendered, track rendered and stream updated/initialized
+events coalesce into one Promise microtask. This keeps notice/check ordering within
+a synchronous menu selection intact. Events emitted by a formatter during refresh
+do not schedule recursive refreshes. Unchanged playback-time events only read the
+Auto boolean; they do not call formatters or redraw menus. Pure configuration writes
+with no subsequent SDK event still need explicit `update()`, especially while paused.
+No polling timer or SDK method interception is installed.
+
+Stream teardown invalidates queued work and clears menus without reading detached
+media. Stream initialized/updated can restore menus on the same caller-owned SDK.
+Replacing `art.dash` requires ready/restart or explicit update to bind the new SDK.
+Release invalidates the record before calling the captured `off` method and attempts
+every owned removal. Reentrant replacement wins; caller listeners remain installed.
+
+An asynchronous SDK getter/formatter failure stops observation, clears owned menus,
+and warns with the original error. Restore the offending formatter/SDK state and
+call explicit `update()` to recover. Explicit update and synchronous menu errors keep
+their original throwing behavior. Never convert the public update API to a Promise
+or destroy an SDK to handle a plugin rendering failure.
+
 ## Types and compatibility
 
 `src/types.ts` describes the narrow SDK and registry surfaces, menu models, event
@@ -127,8 +153,9 @@ multi-quality/multi-audio DASH segments. It covers decoding, explicit update aft
 external selection, source topology replacement, retained callbacks and SDK ownership.
 It also includes a native SDK control without an ArtPlayer instance. Early SDK 4.5.2
 paused-seek stalls remain open; later passes do not resolve them. Unsupported MSE is
-recorded as a playback capability gap, not acceptance. This plugin currently refreshes
-on ready/restart/explicit update, not automatically on external SDK events.
+recorded as a playback capability gap, not acceptance. SDK event tests also cover
+external selections without explicit update, same-SDK source replacement, asynchronous
+formatter error/recovery, and actual setting clicks during SDK refresh.
 `refactor/scripts/dash-sdk-types.test.mjs` compares actual SDK-only and plugin
 consumers across ten compiler/module configurations, retaining upstream-only
 Node10/old DOM diagnostics. The exact peer dependency closure is hash-pinned in

packages/artplayer-plugin-dash-control/README.md

@@ -6,6 +6,14 @@ Accepts a caller-owned dash.js instance at `art.dash`. Quality selection adapts
 dash.js 4.x quality methods or 5.x representation methods. Version 5 selection uses
 representation IDs so bitrate filtering does not change the selected quality.
 
+Quality, track and stream events from the SDK refresh the control and setting menus.
+Refreshes are coalesced after the current synchronous selection finishes. During
+playback, the plugin also checks for changes to the SDK's Auto setting without
+redrawing menus on unchanged time updates. When changing only SDK configuration
+while paused (with no SDK event), call the existing synchronous
+`art.plugins.artplayerPluginDashControl.update()` to refresh immediately.
+The plugin removes only its own SDK listeners and never destroys your SDK instance.
+
 ## TypeScript
 
 The formatter receives the original SDK object. For dash.js 5.2.1 types:

packages/artplayer-plugin-dash-control/dist/artplayer-plugin-dash-control.js

@@ -4,4 +4,4 @@
  * (c) 2017-2026 Harvey Zhao
  * Released under the MIT License.
  */
-!function(t,e){"object"===typeof exports&&"undefined"!==typeof module?module.exports=e():"function"==typeof define&&define.amd?(t.artplayerPluginDashControl=e(),define(function(){return t.artplayerPluginDashControl})):(t="undefined"!==typeof globalThis?globalThis:t||self).artplayerPluginDashControl=e()}(this,function(){"use strict";function t(t){const e=new Map;return t.filter(t=>{if(void 0===t.html)return!0;const n=e.get(t.html);return n?(t.default&&Object.assign(n,t),!1):(e.set(t.html,t),!0)})}function e(t,e,n){let o;const r=new Map;function l(n,o=r.get(n)){if(!o||r.get(n)!==o)return;r.delete(n);const l=t[n];"controls"===n&&l.cache?.get&&l.cache.get(e)?.option?.onSelect!==o||"setting"===n&&l.find&&l.find(e)?.onSelect!==o||l.remove(e)}function i(){let t;o=void 0;for(const[n,o]of[...r])try{l(n,o)}catch(e){t||(t=e)}if(t)throw t}return{update:function(c,s,u){if(!s)return void i();const a={};o=a;const f=()=>a===o&&u(),d=e=>f()?(s.select(e,f),f()?(t.notice.show=`${s.title}: ${e.html}`,f()&&c.control&&t.controls.check(e),f()&&c.setting&&t.setting.check(e),e.html):e.html):e.html;c.control?(r.set("controls",d),t.controls.update({name:e,position:"right",html:s.html,style:{padding:"0 10px"},selector:s.selector,onSelect:d})):l("controls"),f()&&(c.setting?(r.set("setting",d),t.setting.update({name:e,tooltip:s.html,html:s.title,icon:n,width:200,selector:s.selector,onSelect:d})):l("setting"))},clear:i}}return function(n={}){return o=>{const r=o,{$video:l}=r.template,{errorHandle:i}=r.constructor.utils;let c=!1,s=0;const u=e(r,"dash-quality",'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" height="18"><path fill="#fff" d="M0 96C0 60.7 28.7 32 64 32l384 0c35.3 0 64 28.7 64 64l0 320c0 35.3-28.7 64-64 64L64 480c-35.3 0-64-28.7-64-64L0 96zM323.8 202.5c-4.5-6.6-11.9-10.5-19.8-10.5s-15.4 3.9-19.8 10.5l-87 127.6L170.7 297c-4.6-5.7-11.5-9-18.7-9s-14.2 3.3-18.7 9l-64 80c-5.8 7.2-6.9 17.1-2.9 25.4s12.4 13.6 21.6 13.6l96 0 32 0 208 0c8.9 0 17.1-4.9 21.2-12.8s3.6-17.4-1.4-24.7l-120-176zM112 192a48 48 0 1 0 0-96 48 48 0 1 0 0 96z"/></svg>'),a=e(r,"dash-audio",'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" height="18"><path fill="#fff" d="M256 80C149.9 80 62.4 159.4 49.6 262c9.4-3.8 19.6-6 30.4-6c26.5 0 48 21.5 48 48l0 128c0 26.5-21.5 48-48 48c-44.2 0-80-35.8-80-80l0-16 0-48 0-48C0 146.6 114.6 32 256 32s256 114.6 256 256l0 48 0 48 0 16c0 44.2-35.8 80-80 80c-26.5 0-48-21.5-48-48l0-128c0-26.5 21.5-48 48-48c10.8 0 21 2.1 30.4 6C449.6 159.4 362.1 80 256 80z"/></svg>'),f=[];function d(t=()=>!0){let e;for(const o of[u.clear,a.clear]){if(!t())break;try{o()}catch(n){e||(e=n)}}if(e)throw e}function h(){if(c||r.isDestroy)return;const e=++s,o=r.dash,f=()=>!c&&!r.isDestroy&&e===s&&r.dash===o,h=()=>f()&&o.getVideoElement()===l&&f();try{if(i(o.getVideoElement()===l,'Cannot find instance of DASH from "art.dash"'),!f())return;const e=n.quality||{},r=function(e,n,o){const r=function(t){const e="function"===typeof t.getRepresentationsByType;return{levels:()=>e?t.getRepresentationsByType("video"):t.getBitrateInfoListFor("video"),current(n){if(e)return t.getCurrentRepresentationForType("video");const o=t.getQualityFor("video");return n.find(t=>t.qualityIndex===o)},item:(t,n,o,r)=>e?{value:n,id:t.id,default:!r&&null!=o&&t.id===o.id}:{value:t.qualityIndex,default:!r&&null!=o&&t.qualityIndex===o.qualityIndex},select(n,o){const r="auto"===n.value;t.updateSettings({streaming:{abr:{autoSwitchBitrate:{video:r}}}}),!r&&o()&&(e?t.setRepresentationForTypeById("video",n.id):t.setQualityFor("video",n.value))}}}(e),l=r.levels();if(!o()||!l?.length)return null;const i=n.auto||"Auto",c=n.getName||(t=>`${t.height}p`),s=r.current(l);if(!o())return null;const u=e.getSettings().streaming.abr.autoSwitchBitrate.video;if(!o())return null;const a=!u&&s?c(s):i;if(!o())return null;const f=[];for(const[t,h]of l.entries()){const e=c(h);if(!o())return null;f.push({html:e,...r.item(h,t,s,u)})}const d=t(f).sort((t,e)=>e.value-t.value);return d.push({html:i,value:"auto",default:u}),{html:a,title:n.title||"Quality",selector:d,select:r.select}}(o,e,h);if(!h())return;if(u.update(e,r,h),!h())return;const c=n.audio||{},s=function(e,n,o){const r=e.getTracksFor("audio");if(!o()||!r?.length)return null;const l=n.auto||"Auto",i=n.getName||(t=>t.lang||t.id),c=e.getCurrentTrackFor("audio")||r[0];if(!o())return null;const s=c?i(c):l;if(!o())return null;const u=function(t,e){if(t.includes(e))return e;if(null==e.id&&null==e.index)return;const n=["id","index","lang"],o=t.filter(t=>n.every(n=>null==e[n]||t[n]===e[n]));return 1===o.length?o[0]:void 0}(r,c),a=[];for(const t of r){const e=i(t);if(!o())return null;a.push({html:e,value:t,default:t===u})}const f=t(a);return{html:s,title:n.title||"Audio",selector:f,select:t=>e.setCurrentTrack(t.value)}}(o,c,h);h()&&a.update(c,s,h)}catch(g){if(f()){const t=++s;try{d(()=>s===t)}catch(p){console.warn("ArtPlayer DASH cleanup failed:",p)}}throw g}}function g(){if(c)return;let t;c=!0,s++;const e=[d,...f.splice(0).map(([t,e])=>()=>r.Line truncated
+!function(t,e){"object"===typeof exports&&"undefined"!==typeof module?module.exports=e():"function"==typeof define&&define.amd?(t.artplayerPluginDashControl=e(),define(function(){return t.artplayerPluginDashControl})):(t="undefined"!==typeof globalThis?globalThis:t||self).artplayerPluginDashControl=e()}(this,function(){"use strict";function t(t){const e=new Map;return t.filter(t=>{if(void 0===t.html)return!0;const n=e.get(t.html);return n?(t.default&&Object.assign(n,t),!1):(e.set(t.html,t),!0)})}function e(t,e,n){let o;const r=new Map;function i(n,o=r.get(n)){if(!o||r.get(n)!==o)return;r.delete(n);const i=t[n];"controls"===n&&i.cache?.get&&i.cache.get(e)?.option?.onSelect!==o||"setting"===n&&i.find&&i.find(e)?.onSelect!==o||i.remove(e)}function c(){let t;o=void 0;for(const[n,o]of[...r])try{i(n,o)}catch(e){t||(t=e)}if(t)throw t}return{update:function(s,l,a){if(!l)return void c();const u={};o=u;const f=()=>u===o&&a(),d=e=>f()?(l.select(e,f),f()?(t.notice.show=`${l.title}: ${e.html}`,f()&&s.control&&t.controls.check(e),f()&&s.setting&&t.setting.check(e),e.html):e.html):e.html;s.control?(r.set("controls",d),t.controls.update({name:e,position:"right",html:l.html,style:{padding:"0 10px"},selector:l.selector,onSelect:d})):i("controls"),f()&&(s.setting?(r.set("setting",d),t.setting.update({name:e,tooltip:l.html,html:l.title,icon:n,width:200,selector:l.selector,onSelect:d})):i("setting"))},clear:c}}return function(n={}){return o=>{const r=o,{$video:i}=r.template,{errorHandle:c}=r.constructor.utils;let s=!1,l=0;const a=e(r,"dash-quality",'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" height="18"><path fill="#fff" d="M0 96C0 60.7 28.7 32 64 32l384 0c35.3 0 64 28.7 64 64l0 320c0 35.3-28.7 64-64 64L64 480c-35.3 0-64-28.7-64-64L0 96zM323.8 202.5c-4.5-6.6-11.9-10.5-19.8-10.5s-15.4 3.9-19.8 10.5l-87 127.6L170.7 297c-4.6-5.7-11.5-9-18.7-9s-14.2 3.3-18.7 9l-64 80c-5.8 7.2-6.9 17.1-2.9 25.4s12.4 13.6 21.6 13.6l96 0 32 0 208 0c8.9 0 17.1-4.9 21.2-12.8s3.6-17.4-1.4-24.7l-120-176zM112 192a48 48 0 1 0 0-96 48 48 0 1 0 0 96z"/></svg>'),u=e(r,"dash-audio",'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" height="18"><path fill="#fff" d="M256 80C149.9 80 62.4 159.4 49.6 262c9.4-3.8 19.6-6 30.4-6c26.5 0 48 21.5 48 48l0 128c0 26.5-21.5 48-48 48c-44.2 0-80-35.8-80-80l0-16 0-48 0-48C0 146.6 114.6 32 256 32s256 114.6 256 256l0 48 0 48 0 16c0 44.2-35.8 80-80 80c-26.5 0-48-21.5-48-48l0-128c0-26.5 21.5-48 48-48c10.8 0 21 2.1 30.4 6C449.6 159.4 362.1 80 256 80z"/></svg>'),f=[],d=function(t){let e;const n=n=>e===n&&t.active(n.dash),o=t=>t.dash.getSettings().streaming.abr.autoSwitchBitrate.video;function r(){const t=e;if(!t)return;let n;e=void 0,t.epoch++;for(const[e,r]of t.callbacks.splice(0))try{t.off.call(t.dash,e,r)}catch(o){n||(n=o)}if(n)throw n}function i(n,o){if(e===n){try{r()}catch(i){console.warn("ArtPlayer DASH subscription cleanup failed:",i)}if(!e&&t.active(n.dash))try{t.reset()}catch(i){console.warn("ArtPlayer DASH cleanup failed:",i)}}console.warn("ArtPlayer DASH refresh failed:",o)}function c(e){if(!n(e)||e.suspended||e.queued||e.running)return;e.queued=!0;const r=e.epoch;Promise.resolve().then(()=>{if(n(e)&&e.epoch===r&&!e.suspended){e.queued=!1,e.running=!0;try{e.automatic=o(e),n(e)&&t.refresh()}catch(c){i(e,c)}finally{e.running=!1}}})}return{bind:function(s){const l=e;if(l?.dash===s){const t=o(l);return void(n(l)&&(l.automatic=t,l.suspended=!1))}if(r(),e||!t.active(s)||"function"!==typeof s.on||"function"!==typeof s.off)return;const a={dash:s,off:s.off,callbacks:[],epoch:0,queued:!1,running:!1,suspended:!1,automatic:!1};e=a;const u=s.on;try{a.automatic=o(a);const e=["qualityChangeRequested","qualityChangeRendered","trackChangeRendered","streamUpdated","streamInitialized"].map(t=>[t,()=>{"streamUpdated"!==t&&"streamInitialized"!==t||(a.suspended=!1),c(a)}]);e.push(["playbackTimeUpdated",()=>{if(n(a)&&!a.suspended)try{const t=o(a);n(a)&&t!==a.automatic&&(a.automatic=t,c(a))}catch(t){i(a,t)}}]),e.push(["streamTeardownComplete",()=>{if(n(a)){a.epoch++,a.queued=!1,a.suspended=!0;try{t.reset()}catch(e){i(a,e)}}}]);for(const t of e){if(!n(a))break;a.callbacks.push(t),u.call(s,...t)}}catch(f){if(e===a)try{r()}catch(d){console.warn("ArtPlayer DASH subscription cleanup failed:",d)}throw f}},release:r}}({active:t=>!s&&!r.isDestroy&&r.dash===t,refresh:p,reset(){const t=++l;h(()=>t===l)}});function h(t=()=>!0){let e;for(const o of[a.clear,u.clear]){if(!t())break;try{o()}catch(n){e||(e=n)}}if(e)throw e}function p(){if(s||r.isDestroy)return;const e=++l,o=r.dash,f=()=>!s&&!r.isDestroy&&e===l&&r.dash===o,p=()=>f()&&o.getVideoElement()===i&&f();try{if(c(o.getVideoElement()===i,'Cannot find instance of DASH from "art.dash"'),!f())return;if(d.bind(o),!p())return;const e=n.quality||{},r=function(e,n,o){const r=function(t){const e="function"===typeof t.getRepresentationsByType;return{levels:()=>e?t.getRepresentationsByType("video"):t.getBitrateInfoListFor("video"),current(n){if(e)return t.getCurrentRepresentationForTyLine truncated

packages/artplayer-plugin-dash-control/dist/artplayer-plugin-dash-control.legacy.js

@@ -4,4 +4,4 @@
  * (c) 2017-2026 Harvey Zhao
  * Released under the MIT License.
  */
-!function(t,e){"object"===typeof exports&&"undefined"!==typeof module?module.exports=e():"function"==typeof define&&define.amd?(t.artplayerPluginDashControl=e(),define(function(){return t.artplayerPluginDashControl})):(t="undefined"!==typeof globalThis?globalThis:t||self).artplayerPluginDashControl=e()}(this,function(){"use strict";var t=Object.defineProperty,e=Object.getOwnPropertySymbols,n=Object.prototype.hasOwnProperty,o=Object.prototype.propertyIsEnumerable,r=(e,n,o)=>n in e?t(e,n,{enumerable:!0,configurable:!0,writable:!0,value:o}):e[n]=o,l=(t,l)=>{for(var i in l||(l={}))n.call(l,i)&&r(t,i,l[i]);if(e)for(var i of e(l))o.call(l,i)&&r(t,i,l[i]);return t};function i(t){const e=new Map;return t.filter(t=>{if(void 0===t.html)return!0;const n=e.get(t.html);return n?(t.default&&Object.assign(n,t),!1):(e.set(t.html,t),!0)})}function c(t,e,n){let o;const r=new Map;function l(n,o=r.get(n)){var l,i,c,u;if(!o||r.get(n)!==o)return;r.delete(n);const s=t[n];"controls"===n&&(null==(l=s.cache)?void 0:l.get)&&(null==(c=null==(i=s.cache.get(e))?void 0:i.option)?void 0:c.onSelect)!==o||"setting"===n&&s.find&&(null==(u=s.find(e))?void 0:u.onSelect)!==o||s.remove(e)}function i(){let t;o=void 0;for(const[n,o]of[...r])try{l(n,o)}catch(e){t||(t=e)}if(t)throw t}return{update:function(c,u,s){if(!u)return void i();const a={};o=a;const f=()=>a===o&&s(),d=e=>f()?(u.select(e,f),f()?(t.notice.show=`${u.title}: ${e.html}`,f()&&c.control&&t.controls.check(e),f()&&c.setting&&t.setting.check(e),e.html):e.html):e.html;c.control?(r.set("controls",d),t.controls.update({name:e,position:"right",html:u.html,style:{padding:"0 10px"},selector:u.selector,onSelect:d})):l("controls"),f()&&(c.setting?(r.set("setting",d),t.setting.update({name:e,tooltip:u.html,html:u.title,icon:n,width:200,selector:u.selector,onSelect:d})):l("setting"))},clear:i}}return function(t={}){return e=>{const n=e,{$video:o}=n.template,{errorHandle:r}=n.constructor.utils;let u=!1,s=0;const a=c(n,"dash-quality",'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" height="18"><path fill="#fff" d="M0 96C0 60.7 28.7 32 64 32l384 0c35.3 0 64 28.7 64 64l0 320c0 35.3-28.7 64-64 64L64 480c-35.3 0-64-28.7-64-64L0 96zM323.8 202.5c-4.5-6.6-11.9-10.5-19.8-10.5s-15.4 3.9-19.8 10.5l-87 127.6L170.7 297c-4.6-5.7-11.5-9-18.7-9s-14.2 3.3-18.7 9l-64 80c-5.8 7.2-6.9 17.1-2.9 25.4s12.4 13.6 21.6 13.6l96 0 32 0 208 0c8.9 0 17.1-4.9 21.2-12.8s3.6-17.4-1.4-24.7l-120-176zM112 192a48 48 0 1 0 0-96 48 48 0 1 0 0 96z"/></svg>'),f=c(n,"dash-audio",'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" height="18"><path fill="#fff" d="M256 80C149.9 80 62.4 159.4 49.6 262c9.4-3.8 19.6-6 30.4-6c26.5 0 48 21.5 48 48l0 128c0 26.5-21.5 48-48 48c-44.2 0-80-35.8-80-80l0-16 0-48 0-48C0 146.6 114.6 32 256 32s256 114.6 256 256l0 48 0 48 0 16c0 44.2-35.8 80-80 80c-26.5 0-48-21.5-48-48l0-128c0-26.5 21.5-48 48-48c10.8 0 21 2.1 30.4 6C449.6 159.4 362.1 80 256 80z"/></svg>'),d=[];function h(t=()=>!0){let e;for(const o of[a.clear,f.clear]){if(!t())break;try{o()}catch(n){e||(e=n)}}if(e)throw e}function p(){if(u||n.isDestroy)return;const e=++s,c=n.dash,d=()=>!u&&!n.isDestroy&&e===s&&n.dash===c,p=()=>d()&&c.getVideoElement()===o&&d();try{if(r(c.getVideoElement()===o,'Cannot find instance of DASH from "art.dash"'),!d())return;const e=t.quality||{},n=function(t,e,n){const o=function(t){const e="function"===typeof t.getRepresentationsByType;return{levels:()=>e?t.getRepresentationsByType("video"):t.getBitrateInfoListFor("video"),current(n){if(e)return t.getCurrentRepresentationForType("video");const o=t.getQualityFor("video");return n.find(t=>t.qualityIndex===o)},item:(t,n,o,r)=>e?{value:n,id:t.id,default:!r&&null!=o&&t.id===o.id}:{value:t.qualityIndex,default:!r&&null!=o&&t.qualityIndex===o.qualityIndex},select(n,o){const r="auto"===n.value;t.updateSettings({streaming:{abr:{autoSwitchBitrate:{video:r}}}}),!r&&o()&&(e?t.setRepresentationForTypeById("video",n.id):t.setQualityFor("video",n.value))}}}(t),r=o.levels();if(!n()||!(null==r?void 0:r.length))return null;const c=e.auto||"Auto",u=e.getName||(t=>`${t.height}p`),s=o.current(r);if(!n())return null;const a=t.getSettings().streaming.abr.autoSwitchBitrate.video;if(!n())return null;const f=!a&&s?u(s):c;if(!n())return null;const d=[];for(const[i,p]of r.entries()){const t=u(p);if(!n())return null;d.push(l({html:t},o.item(p,i,s,a)))}const h=i(d).sort((t,e)=>e.value-t.value);return h.push({html:c,value:"auto",default:a}),{html:f,title:e.title||"Quality",selector:h,select:o.select}}(c,e,p);if(!p())return;if(a.update(e,n,p),!p())return;const u=t.audio||{},s=function(t,e,n){const o=t.getTracksFor("audio");if(!n()||!(null==o?void 0:o.length))return null;const r=e.auto||"Auto",l=e.getName||(t=>t.lang||t.id),c=t.getCurrentTrackFor("audio")||o[0];if(!n())return null;const u=c?l(c):r;if(!n())return null;const s=function(t,e){if(t.includes(e))return e;if(null==e.id&&null==e.index)return;const n=["id","index","lang"],o=t.filter(t=>n.every(n=>null==e[n]||t[n]===e[n]));returLine truncated
+!function(t,e){"object"===typeof exports&&"undefined"!==typeof module?module.exports=e():"function"==typeof define&&define.amd?(t.artplayerPluginDashControl=e(),define(function(){return t.artplayerPluginDashControl})):(t="undefined"!==typeof globalThis?globalThis:t||self).artplayerPluginDashControl=e()}(this,function(){"use strict";var t=Object.defineProperty,e=Object.getOwnPropertySymbols,n=Object.prototype.hasOwnProperty,o=Object.prototype.propertyIsEnumerable,r=(e,n,o)=>n in e?t(e,n,{enumerable:!0,configurable:!0,writable:!0,value:o}):e[n]=o,i=(t,i)=>{for(var l in i||(i={}))n.call(i,l)&&r(t,l,i[l]);if(e)for(var l of e(i))o.call(i,l)&&r(t,l,i[l]);return t};function l(t){const e=new Map;return t.filter(t=>{if(void 0===t.html)return!0;const n=e.get(t.html);return n?(t.default&&Object.assign(n,t),!1):(e.set(t.html,t),!0)})}function c(t,e,n){let o;const r=new Map;function i(n,o=r.get(n)){var i,l,c,a;if(!o||r.get(n)!==o)return;r.delete(n);const s=t[n];"controls"===n&&(null==(i=s.cache)?void 0:i.get)&&(null==(c=null==(l=s.cache.get(e))?void 0:l.option)?void 0:c.onSelect)!==o||"setting"===n&&s.find&&(null==(a=s.find(e))?void 0:a.onSelect)!==o||s.remove(e)}function l(){let t;o=void 0;for(const[n,o]of[...r])try{i(n,o)}catch(e){t||(t=e)}if(t)throw t}return{update:function(c,a,s){if(!a)return void l();const u={};o=u;const f=()=>u===o&&s(),d=e=>f()?(a.select(e,f),f()?(t.notice.show=`${a.title}: ${e.html}`,f()&&c.control&&t.controls.check(e),f()&&c.setting&&t.setting.check(e),e.html):e.html):e.html;c.control?(r.set("controls",d),t.controls.update({name:e,position:"right",html:a.html,style:{padding:"0 10px"},selector:a.selector,onSelect:d})):i("controls"),f()&&(c.setting?(r.set("setting",d),t.setting.update({name:e,tooltip:a.html,html:a.title,icon:n,width:200,selector:a.selector,onSelect:d})):i("setting"))},clear:l}}return function(t={}){return e=>{const n=e,{$video:o}=n.template,{errorHandle:r}=n.constructor.utils;let a=!1,s=0;const u=c(n,"dash-quality",'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" height="18"><path fill="#fff" d="M0 96C0 60.7 28.7 32 64 32l384 0c35.3 0 64 28.7 64 64l0 320c0 35.3-28.7 64-64 64L64 480c-35.3 0-64-28.7-64-64L0 96zM323.8 202.5c-4.5-6.6-11.9-10.5-19.8-10.5s-15.4 3.9-19.8 10.5l-87 127.6L170.7 297c-4.6-5.7-11.5-9-18.7-9s-14.2 3.3-18.7 9l-64 80c-5.8 7.2-6.9 17.1-2.9 25.4s12.4 13.6 21.6 13.6l96 0 32 0 208 0c8.9 0 17.1-4.9 21.2-12.8s3.6-17.4-1.4-24.7l-120-176zM112 192a48 48 0 1 0 0-96 48 48 0 1 0 0 96z"/></svg>'),f=c(n,"dash-audio",'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" height="18"><path fill="#fff" d="M256 80C149.9 80 62.4 159.4 49.6 262c9.4-3.8 19.6-6 30.4-6c26.5 0 48 21.5 48 48l0 128c0 26.5-21.5 48-48 48c-44.2 0-80-35.8-80-80l0-16 0-48 0-48C0 146.6 114.6 32 256 32s256 114.6 256 256l0 48 0 48 0 16c0 44.2-35.8 80-80 80c-26.5 0-48-21.5-48-48l0-128c0-26.5 21.5-48 48-48c10.8 0 21 2.1 30.4 6C449.6 159.4 362.1 80 256 80z"/></svg>'),d=[],h=function(t){let e;const n=n=>e===n&&t.active(n.dash),o=t=>t.dash.getSettings().streaming.abr.autoSwitchBitrate.video;function r(){const t=e;if(!t)return;let n;e=void 0,t.epoch++;for(const[e,r]of t.callbacks.splice(0))try{t.off.call(t.dash,e,r)}catch(o){n||(n=o)}if(n)throw n}function i(n,o){if(e===n){try{r()}catch(i){console.warn("ArtPlayer DASH subscription cleanup failed:",i)}if(!e&&t.active(n.dash))try{t.reset()}catch(i){console.warn("ArtPlayer DASH cleanup failed:",i)}}console.warn("ArtPlayer DASH refresh failed:",o)}function l(e){if(!n(e)||e.suspended||e.queued||e.running)return;e.queued=!0;const r=e.epoch;Promise.resolve().then(()=>{if(n(e)&&e.epoch===r&&!e.suspended){e.queued=!1,e.running=!0;try{e.automatic=o(e),n(e)&&t.refresh()}catch(l){i(e,l)}finally{e.running=!1}}})}return{bind:function(c){const a=e;if((null==a?void 0:a.dash)===c){const t=o(a);return void(n(a)&&(a.automatic=t,a.suspended=!1))}if(r(),e||!t.active(c)||"function"!==typeof c.on||"function"!==typeof c.off)return;const s={dash:c,off:c.off,callbacks:[],epoch:0,queued:!1,running:!1,suspended:!1,automatic:!1};e=s;const u=c.on;try{s.automatic=o(s);const e=["qualityChangeRequested","qualityChangeRendered","trackChangeRendered","streamUpdated","streamInitialized"].map(t=>[t,()=>{"streamUpdated"!==t&&"streamInitialized"!==t||(s.suspended=!1),l(s)}]);e.push(["playbackTimeUpdated",()=>{if(n(s)&&!s.suspended)try{const t=o(s);n(s)&&t!==s.automatic&&(s.automatic=t,l(s))}catch(t){i(s,t)}}]),e.push(["streamTeardownComplete",()=>{if(n(s)){s.epoch++,s.queued=!1,s.suspended=!0;try{t.reset()}catch(e){i(s,e)}}}]);for(const t of e){if(!n(s))break;s.callbacks.push(t),u.call(c,...t)}}catch(f){if(e===s)try{r()}catch(d){console.warn("ArtPlayer DASH subscription cleanup failed:",d)}throw f}},release:r}}({active:t=>!a&&!n.isDestroy&&n.dash===t,refresh:y,reset(){const t=++s;p(()=>t===s)}});function p(t=()=>!0){let e;for(const o of[u.clear,f.clear]){if(!t())break;try{o()}catch(n){e||(e=n)}}if(e)throw e}function y(){if(a||n.isDestroy)return;const e=++s,c=n.dash,d=()=>!a&&!n.isDestLine truncated

packages/artplayer-plugin-dash-control/dist/artplayer-plugin-dash-control.mjs

@@ -170,6 +170,133 @@ function createMenu(art, name, icon) {
   return { update, clear };
 }
 const $quality = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" height="18"><path fill="#fff" d="M0 96C0 60.7 28.7 32 64 32l384 0c35.3 0 64 28.7 64 64l0 320c0 35.3-28.7 64-64 64L64 480c-35.3 0-64-28.7-64-64L0 96zM323.8 202.5c-4.5-6.6-11.9-10.5-19.8-10.5s-15.4 3.9-19.8 10.5l-87 127.6L170.7 297c-4.6-5.7-11.5-9-18.7-9s-14.2 3.3-18.7 9l-64 80c-5.8 7.2-6.9 17.1-2.9 25.4s12.4 13.6 21.6 13.6l96 0 32 0 208 0c8.9 0 17.1-4.9 21.2-12.8s3.6-17.4-1.4-24.7l-120-176zM112 192a48 48 0 1 0 0-96 48 48 0 1 0 0 96z"/></svg>';
+function observeSDK(options) {
+  let binding;
+  const active = (record) => binding === record && options.active(record.dash);
+  const automatic = (record) => record.dash.getSettings().streaming.abr.autoSwitchBitrate.video;
+  function release() {
+    const record = binding;
+    if (!record)
+      return;
+    binding = void 0;
+    record.epoch++;
+    let failure;
+    for (const [name, callback] of record.callbacks.splice(0)) {
+      try {
+        record.off.call(record.dash, name, callback);
+      } catch (error) {
+        failure || (failure = error);
+      }
+    }
+    if (failure)
+      throw failure;
+  }
+  function fail(record, error) {
+    if (binding === record) {
+      try {
+        release();
+      } catch (cleanupError) {
+        console.warn("ArtPlayer DASH subscription cleanup failed:", cleanupError);
+      }
+      if (!binding && options.active(record.dash)) {
+        try {
+          options.reset();
+        } catch (cleanupError) {
+          console.warn("ArtPlayer DASH cleanup failed:", cleanupError);
+        }
+      }
+    }
+    console.warn("ArtPlayer DASH refresh failed:", error);
+  }
+  function schedule(record) {
+    if (!active(record) || record.suspended || record.queued || record.running)
+      return;
+    record.queued = true;
+    const epoch = record.epoch;
+    void Promise.resolve().then(() => {
+      if (!active(record) || record.epoch !== epoch || record.suspended)
+        return;
+      record.queued = false;
+      record.running = true;
+      try {
+        record.automatic = automatic(record);
+        if (active(record))
+          options.refresh();
+      } catch (error) {
+        fail(record, error);
+      } finally {
+        record.running = false;
+      }
+    });
+  }
+  function bind(dash) {
+    const previous = binding;
+    if (previous?.dash === dash) {
+      const value = automatic(previous);
+      if (active(previous)) {
+        previous.automatic = value;
+        previous.suspended = false;
+      }
+      return;
+    }
+    release();
+    if (binding || !options.active(dash) || typeof dash.on !== "function" || typeof dash.off !== "function")
+      return;
+    const record = { dash, off: dash.off, callbacks: [], epoch: 0, queued: false, running: false, suspended: false, automatic: false };
+    binding = record;
+    const on = dash.on;
+    try {
+      record.automatic = automatic(record);
+      const changed = ["qualityChangeRequested", "qualityChangeRendered", "trackChangeRendered", "streamUpdated", "streamInitialized"];
+      const entries = changed.map((name) => [name, () => {
+        if (name === "streamUpdated" || name === "streamInitialized")
+          record.suspended = false;
+        schedule(record);
+      }]);
+      entries.push(["playbackTimeUpdated", () => {
+        if (!active(record) || record.suspended)
+          return;
+        try {
+          const value = automatic(record);
+          if (active(record) && value !== record.automatic) {
+            record.automatic = value;
+            schedule(record);
+          }
+        } catch (error) {
+          fail(record, error);
+        }
+      }]);
+      entries.push(["streamTeardownComplete", () => {
+        if (!active(record))
+          return;
+        record.epoch++;
+        record.queued = false;
+        record.suspended = true;
+        try {
+          options.reset();
+        } catch (error) {
+          fail(record, error);
+        }
+      }]);
+      for (const entry of entries) {
+        if (!active(record))
+          break;
+        record.callbacks.push(entry);
+        on.call(dash, ...entry);
+      }
+    } catch (error) {
+      if (binding === record) {
+        try {
+          release();
+        } catch (cleanupError) {
+          console.warn("ArtPlayer DASH subscription cleanup failed:", cleanupError);
+        }
+      }
+      throw error;
+    }
+  }
+  return { bind, release };
+}
 function artplayerPluginDashControl(option = {}) {
   return (player) => {
     const art = player;
@@ -180,6 +307,14 @@ function artplayerPluginDashControl(option = {}) {
     const quality = createMenu(art, "dash-quality", $quality);
     const audio = createMenu(art, "dash-audio", $audio);
     const subscriptions = [];
+    const observer = observeSDK({
+      active: (dash) => !closed && !art.isDestroy && art.dash === dash,
+      refresh: update,
+      reset() {
+        const version = ++revision;
+        clear(() => version === revision);
+      }
+    });
     function clear(current = () => true) {
       let failure;
       for (const cleanup of [quality.clear, audio.clear]) {
@@ -205,6 +340,9 @@ function artplayerPluginDashControl(option = {}) {
         errorHandle(dash.getVideoElement() === $video, 'Cannot find instance of DASH from "art.dash"');
         if (!current())
           return;
+        observer.bind(dash);
+        if (!valid())
+          return;
         const qualityConfig = option.quality || {};
         const qualities = qualityModel(dash, qualityConfig, valid);
         if (!valid())
@@ -219,10 +357,12 @@ function artplayerPluginDashControl(option = {}) {
       } catch (error) {
         if (current()) {
           const cleanupVersion = ++revision;
-          try {
-            clear(() => revision === cleanupVersion);
-          } catch (cleanupError) {
-            console.warn("ArtPlayer DASH cleanup failed:", cleanupError);
+          for (const cleanup of [observer.release, () => clear(() => revision === cleanupVersion)]) {
+            try {
+              cleanup();
+            } catch (cleanupError) {
+              console.warn("ArtPlayer DASH cleanup failed:", cleanupError);
+            }
           }
         }
         throw error;
@@ -234,7 +374,7 @@ function artplayerPluginDashControl(option = {}) {
       closed = true;
       revision++;
       let failure;
-      const actions = [clear, ...subscriptions.splice(0).map(([name, callback]) => () => art.off(name, callback))];
+      const actions = [observer.release, clear, ...subscriptions.splice(0).map(([name, callback]) => () => art.off(name, callback))];
       for (const action of actions) {
         try {
           action();

packages/artplayer-plugin-dash-control/src/index.ts

@@ -5,6 +5,7 @@ import $audio from './audio.svg?raw'
 import { audioModel, qualityModel } from './mapping'
 import { createMenu } from './menu'
 import $quality from './quality.svg?raw'
+import { observeSDK } from './sdk-events'
 
 export default function artplayerPluginDashControl<Level extends object = QualityLevel, Track extends object = AudioTrack>(option: Option<Level, Track> = {}) {
   return (player: Artplayer): Result => {
@@ -17,6 +18,14 @@ export default function artplayerPluginDashControl<Level extends object = Qualit
     const quality = createMenu<QualityItem>(art, 'dash-quality', $quality)
     const audio = createMenu<AudioItem<Track>>(art, 'dash-audio', $audio)
     const subscriptions: [EventName, Cleanup][] = []
+    const observer = observeSDK<Level, Track>({
+      active: dash => !closed && !art.isDestroy && art.dash === dash,
+      refresh: update,
+      reset() {
+        const version = ++revision
+        clear(() => version === revision)
+      },
+    })
 
     function clear(current: Valid = () => true): void {
       let failure: unknown
@@ -45,6 +54,9 @@ export default function artplayerPluginDashControl<Level extends object = Qualit
         errorHandle(dash.getVideoElement() === $video, 'Cannot find instance of DASH from "art.dash"')
         if (!current())
           return
+        observer.bind(dash)
+        if (!valid())
+          return
         const qualityConfig = option.quality || {}
         const qualities = qualityModel(dash, qualityConfig, valid)
         if (!valid())
@@ -60,11 +72,13 @@ export default function artplayerPluginDashControl<Level extends object = Qualit
       catch (error) {
         if (current()) {
           const cleanupVersion = ++revision
-          try {
-            clear(() => revision === cleanupVersion)
-          }
-          catch (cleanupError) {
-            console.warn('ArtPlayer DASH cleanup failed:', cleanupError)
+          for (const cleanup of [observer.release, () => clear(() => revision === cleanupVersion)]) {
+            try {
+              cleanup()
+            }
+            catch (cleanupError) {
+              console.warn('ArtPlayer DASH cleanup failed:', cleanupError)
+            }
           }
         }
         throw error
@@ -77,7 +91,7 @@ export default function artplayerPluginDashControl<Level extends object = Qualit
       closed = true
       revision++
       let failure: unknown
-      const actions = [clear, ...subscriptions.splice(0).map(([name, callback]) => () => art.off(name, callback))]
+      const actions = [observer.release, clear, ...subscriptions.splice(0).map(([name, callback]) => () => art.off(name, callback))]
       for (const action of actions) {
         try {
           action()

packages/artplayer-plugin-dash-control/src/sdk-events.ts

@@ -0,0 +1,159 @@
+import type { Cleanup, Dash, SDKEventName } from './types'
+
+interface Binding<Level extends object, Track extends object> {
+  dash: Dash<Level, Track>
+  off: NonNullable<Dash<Level, Track>['off']>
+  callbacks: [SDKEventName, Cleanup][]
+  epoch: number
+  queued: boolean
+  running: boolean
+  suspended: boolean
+  automatic: boolean
+}
+
+export function observeSDK<Level extends object, Track extends object>(options: {
+  active: (dash: Dash<Level, Track>) => boolean
+  refresh: Cleanup
+  reset: Cleanup
+}) {
+  let binding: Binding<Level, Track> | undefined
+  const active = (record: Binding<Level, Track>) => binding === record && options.active(record.dash)
+  const automatic = (record: Binding<Level, Track>) => record.dash.getSettings().streaming.abr.autoSwitchBitrate.video
+
+  function release(): void {
+    const record = binding
+    if (!record)
+      return
+    binding = undefined
+    record.epoch++
+    let failure: unknown
+    for (const [name, callback] of record.callbacks.splice(0)) {
+      try {
+        record.off.call(record.dash, name, callback)
+      }
+      catch (error) {
+        failure ||= error
+      }
+    }
+    if (failure)
+      throw failure
+  }
+
+  function fail(record: Binding<Level, Track>, error: unknown): void {
+    if (binding === record) {
+      try {
+        release()
+      }
+      catch (cleanupError) {
+        console.warn('ArtPlayer DASH subscription cleanup failed:', cleanupError)
+      }
+      if (!binding && options.active(record.dash)) {
+        try {
+          options.reset()
+        }
+        catch (cleanupError) {
+          console.warn('ArtPlayer DASH cleanup failed:', cleanupError)
+        }
+      }
+    }
+    console.warn('ArtPlayer DASH refresh failed:', error)
+  }
+
+  function schedule(record: Binding<Level, Track>): void {
+    if (!active(record) || record.suspended || record.queued || record.running)
+      return
+    record.queued = true
+    const epoch = record.epoch
+    void Promise.resolve().then(() => {
+      if (!active(record) || record.epoch !== epoch || record.suspended)
+        return
+      record.queued = false
+      record.running = true
+      try {
+        record.automatic = automatic(record)
+        if (active(record))
+          options.refresh()
+      }
+      catch (error) {
+        fail(record, error)
+      }
+      finally {
+        record.running = false
+      }
+    })
+  }
+
+  function bind(dash: Dash<Level, Track>): void {
+    const previous = binding
+    if (previous?.dash === dash) {
+      const value = automatic(previous)
+      if (active(previous)) {
+        previous.automatic = value
+        previous.suspended = false
+      }
+      return
+    }
+    release()
+    // An off callback may synchronously install a newer binding.
+    if (binding || !options.active(dash) || typeof dash.on !== 'function' || typeof dash.off !== 'function')
+      return
+    const record: Binding<Level, Track> = { dash, off: dash.off, callbacks: [], epoch: 0, queued: false, running: false, suspended: false, automatic: false }
+    binding = record
+    const on = dash.on
+    try {
+      record.automatic = automatic(record)
+      const changed: SDKEventName[] = ['qualityChangeRequested', 'qualityChangeRendered', 'trackChangeRendered', 'streamUpdated', 'streamInitialized']
+      const entries: [SDKEventName, Cleanup][] = changed.map(name => [name, () => {
+        if (name === 'streamUpdated' || name === 'streamInitialized')
+          record.suspended = false
+        schedule(record)
+      }])
+      entries.push(['playbackTimeUpdated', () => {
+        if (!active(record) || record.suspended)
+          return
+        try {
+          const value = automatic(record)
+          if (active(record) && value !== record.automatic) {
+            record.automatic = value
+            schedule(record)
+          }
+        }
+        catch (error) {
+          fail(record, error)
+        }
+      }])
+      entries.push(['streamTeardownComplete', () => {
+        if (!active(record))
+          return
+        record.epoch++
+        record.queued = false
+        record.suspended = true
+        try {
+          options.reset()
+        }
+        catch (error) {
+          fail(record, error)
+        }
+      }])
+      for (const entry of entries) {
+        if (!active(record))
+          break
+        record.callbacks.push(entry)
+        on.call(dash, ...entry)
+      }
+    }
+    catch (error) {
+      if (binding === record) {
+        try {
+          release()
+        }
+        catch (cleanupError) {
+          console.warn('ArtPlayer DASH subscription cleanup failed:', cleanupError)
+        }
+      }
+      throw error
+    }
+  }
+
+  return { bind, release }
+}

packages/artplayer-plugin-dash-control/src/types.ts

@@ -5,6 +5,7 @@ export type Identifier = string | number
 export type Valid = () => boolean
 export type Cleanup = () => void
 export type EventName = 'ready' | 'restart' | 'destroy'
+export type SDKEventName = 'qualityChangeRequested' | 'qualityChangeRendered' | 'trackChangeRendered' | 'streamUpdated' | 'streamInitialized' | 'playbackTimeUpdated' | 'streamTeardownComplete'
 
 export interface QualityFields {
   height?: number
@@ -15,6 +16,8 @@ export interface QualityFields {
 export type AudioFields = AudioTrack
 
 export interface Dash<Level extends object = object, Track extends object = object> {
+  on?: (name: SDKEventName, callback: Cleanup) => unknown
+  off?: (name: SDKEventName, callback: Cleanup) => unknown
   getVideoElement: () => object | null
   getSettings: () => { streaming: { abr: { autoSwitchBitrate: { video: boolean } } } }
   updateSettings: (settings: { streaming: { abr: { autoSwitchBitrate: { video: boolean } } } }) => unknown