fix(player): checkVisibility api not available on ios safari

mihar-22 · mihar-22 · commit 1ef5e064b30f · 2024-03-18T17:12:01.000+11:00
diff --git a/packages/vidstack/mangle.json b/packages/vidstack/mangle.json
@@ -842,5 +842,6 @@
   "_listeners": "Io",
   "_plyr": "Lo",
   "_ratio": "Ko",
-  "_source": "Jo"
+  "_source": "Jo",
+  "_watchMetadata": "Mo"
 }
diff --git a/packages/vidstack/src/elements/define/layouts/slot-observer.ts b/packages/vidstack/src/elements/define/layouts/slot-observer.ts
@@ -25,9 +25,8 @@ export class SlotObserver {
   }
 
   assign(template: Element | TemplateResult, slot: HTMLSlotElement) {
-    slot.textContent = '';
-
     if (isDOMNode(template)) {
+      slot.textContent = '';
       slot.append(template);
     } else {
       render(template, slot);
diff --git a/packages/vidstack/src/utils/dom.ts b/packages/vidstack/src/utils/dom.ts
@@ -94,7 +94,12 @@ export function isElementVisible(el: HTMLElement) {
 }
 
 export function checkVisibility(el: HTMLElement | null) {
-  return !!el && el.checkVisibility({ checkOpacity: true, checkVisibilityCSS: true });
+  return (
+    !!el &&
+    ('checkVisibility' in el
+      ? el.checkVisibility({ checkOpacity: true, checkVisibilityCSS: true })
+      : isElementVisible(el))
+  );
 }
 
 export function observeVisibility(el: HTMLElement, callback: (isVisible: boolean) => void) {

Original file line number	Diff line number	Diff line change
`@@ -94,7 +94,12 @@ export function isElementVisible(el: HTMLElement) {`
`94`	`94`	`}`
`95`	`95`
`96`	`96`	`export function checkVisibility(el: HTMLElement \| null) {`
`97`		`- return !!el && el.checkVisibility({ checkOpacity: true, checkVisibilityCSS: true });`
	`97`	`+ return (`
	`98`	`+ !!el &&`
	`99`	`+ ('checkVisibility' in el`
	`100`	`+ ? el.checkVisibility({ checkOpacity: true, checkVisibilityCSS: true })`
	`101`	`+ : isElementVisible(el))`
	`102`	`+ );`
`98`	`103`	`}`
`99`	`104`
`100`	`105`	`export function observeVisibility(el: HTMLElement, callback: (isVisible: boolean) => void) {`