@hyperframes/lint 0.8.186 → 0.8.188

package/dist/browser.js

@@ -2023,6 +2023,53 @@ function findRuntimeMediaSrcMutationFindings(ctx) {
   }
   return findings;
 }
+var VOID_ELEMENTS = /* @__PURE__ */ new Set([
+  "area",
+  "base",
+  "br",
+  "col",
+  "embed",
+  "hr",
+  "img",
+  "input",
+  "link",
+  "meta",
+  "source",
+  "track",
+  "wbr"
+]);
+var closeTag = (name) => new RegExp(`</${name}>`, "gi");
+function innermostTimedWrapper(source, tags, media) {
+  let found = null;
+  for (const parent of tags) {
+    if (parent.index >= media.index) break;
+    if (parent.name === "video" || parent.name === "audio" || VOID_ELEMENTS.has(parent.name))
+      continue;
+    if (readDecodedAttr(parent.raw, "data-composition-id")) continue;
+    const start = readAttr(parent.raw, "data-start");
+    if (!start) continue;
+    const events = [
+      ...tags.filter((t) => t.name === parent.name && t.index > parent.index && t.index < media.index).map((t) => [t.index, 1]),
+      ...[...source.substring(parent.index, media.index).matchAll(closeTag(parent.name))].map(
+        (m) => [parent.index + m.index, -1]
+      )
+    ];
+    let depth = 1;
+    for (const [, delta] of events.sort((x, y) => x[0] - y[0])) {
+      depth += delta;
+      if (depth === 0) break;
+    }
+    if (depth > 0) {
+      found = {
+        name: parent.name,
+        id: readAttr(parent.raw, "id") || void 0,
+        start,
+        duration: readAttr(parent.raw, "data-duration")
+      };
+    }
+  }
+  return found;
+}
 var mediaRules = [
   findNestedMediaStartBasisFindings,
   findSpeedRampOnNonMediaFindings,
@@ -2159,54 +2206,19 @@ var mediaRules = [
   // video_nested_in_timed_element
   ({ source, tags }) => {
     const findings = [];
-    const voidElements = /* @__PURE__ */ new Set([
-      "area",
-      "base",
-      "br",
-      "col",
-      "embed",
-      "hr",
-      "img",
-      "input",
-      "link",
-      "meta",
-      "source",
-      "track",
-      "wbr"
-    ]);
-    const timedTagPositions = [];
-    for (const tag of tags) {
-      if (tag.name === "video" || tag.name === "audio") continue;
-      if (voidElements.has(tag.name)) continue;
-      if (readDecodedAttr(tag.raw, "data-composition-id")) continue;
-      if (readAttr(tag.raw, "data-start")) {
-        timedTagPositions.push({
-          name: tag.name,
-          start: tag.index,
-          id: readAttr(tag.raw, "id") || void 0
-        });
-      }
-    }
     for (const tag of tags) {
       if (tag.name !== "video") continue;
       if (!readAttr(tag.raw, "data-start")) continue;
-      for (const parent of timedTagPositions) {
-        if (parent.start < tag.index) {
-          const parentClosePattern = new RegExp(`</${parent.name}>`, "gi");
-          const between = source.substring(parent.start, tag.index);
-          if (!parentClosePattern.test(between)) {
-            findings.push({
-              code: "video_nested_in_timed_element",
-              severity: "error",
-              message: `<video> with data-start is nested inside <${parent.name}${parent.id ? ` id="${parent.id}"` : ""}> which also has data-start. The frame extractor resolves the video's start from its own data-start without the wrapper's offset, while visibility uses the wrapper's window, so the two disagree: the clip shows the wrong source frames and then disappears partway through its slot.`,
-              elementId: readAttr(tag.raw, "id") || void 0,
-              fixHint: "Time the wrapper OR the video, never both: remove data-start from the wrapper (use it as a non-timed visual container), or move the <video> up to be a direct child of the stage.",
-              snippet: truncateSnippet(tag.raw)
-            });
-            break;
-          }
-        }
-      }
+      const parent = innermostTimedWrapper(source, tags, tag);
+      if (!parent) continue;
+      findings.push({
+        code: "video_nested_in_timed_element",
+        severity: "error",
+        message: `<video> with data-start is nested inside <${parent.name}${parent.id ? ` id="${parent.id}"` : ""}> which also has data-start. The frame extractor resolves the video's start from its own data-start without the wrapper's offset, while visibility uses the wrapper's window, so the two disagree: the clip shows the wrong source frames and then disappears partway through its slot.`,
+        elementId: readAttr(tag.raw, "id") || void 0,
+        fixHint: "Time the wrapper OR the video, never both: remove data-start from the wrapper (use it as a non-timed visual container), or move the <video> up to be a direct child of the stage.",
+        snippet: truncateSnippet(tag.raw)
+      });
     }
     return findings;
   },
@@ -2274,7 +2286,7 @@ var mediaRules = [
     return findings;
   },
   // media_missing_data_start + media_missing_id + media_missing_src + media_preload_none
-  ({ tags }) => {
+  ({ source, tags }) => {
     const findings = [];
     for (const tag of tags) {
       if (tag.name !== "video" && tag.name !== "audio") continue;
@@ -2282,12 +2294,13 @@ var mediaRules = [
       const hasId = readAttr(tag.raw, "id");
       const hasSrc = mediaHasResolvableSrc(tag, tags);
       if (hasSrc && !hasDataStart) {
+        const wrapper = tag.name === "video" ? innermostTimedWrapper(source, tags, tag) : null;
         findings.push({
           code: "media_missing_data_start",
           severity: "error",
           message: `<${tag.name}${hasId ? ` id="${hasId}"` : ""}> has src but no data-start. HyperFrames cannot own playback for untimed media, so preview and render behavior can diverge.`,
           elementId: hasId || void 0,
-          fixHint: `Add data-start="0" (or the intended start time) and data-duration if the clip should stop before the source ends.`,
+          fixHint: wrapper ? `This <${tag.name}> sits inside the timed <${wrapper.name}${wrapper.id ? ` id="${wrapper.id}"` : ""}> (data-start="${wrapper.start}"), and the wrapper's data-start would then clash. Move the <${tag.name}> out as a direct child of the stage and give it that wrapper's data-start="${wrapper.start}"${wrapper.duration ? ` and data-duration="${wrapper.duration}"` : ""}.` : `Add data-start="0" (or the intended start time) and data-duration if the clip should stop before the source ends.`,
           snippet: truncateSnippet(tag.raw)
         });
       }

package/dist/index.js

@@ -2029,6 +2029,53 @@ function findRuntimeMediaSrcMutationFindings(ctx) {
   }
   return findings;
 }
+var VOID_ELEMENTS = /* @__PURE__ */ new Set([
+  "area",
+  "base",
+  "br",
+  "col",
+  "embed",
+  "hr",
+  "img",
+  "input",
+  "link",
+  "meta",
+  "source",
+  "track",
+  "wbr"
+]);
+var closeTag = (name) => new RegExp(`</${name}>`, "gi");
+function innermostTimedWrapper(source, tags, media) {
+  let found = null;
+  for (const parent of tags) {
+    if (parent.index >= media.index) break;
+    if (parent.name === "video" || parent.name === "audio" || VOID_ELEMENTS.has(parent.name))
+      continue;
+    if (readDecodedAttr(parent.raw, "data-composition-id")) continue;
+    const start = readAttr(parent.raw, "data-start");
+    if (!start) continue;
+    const events = [
+      ...tags.filter((t) => t.name === parent.name && t.index > parent.index && t.index < media.index).map((t) => [t.index, 1]),
+      ...[...source.substring(parent.index, media.index).matchAll(closeTag(parent.name))].map(
+        (m) => [parent.index + m.index, -1]
+      )
+    ];
+    let depth = 1;
+    for (const [, delta] of events.sort((x, y) => x[0] - y[0])) {
+      depth += delta;
+      if (depth === 0) break;
+    }
+    if (depth > 0) {
+      found = {
+        name: parent.name,
+        id: readAttr(parent.raw, "id") || void 0,
+        start,
+        duration: readAttr(parent.raw, "data-duration")
+      };
+    }
+  }
+  return found;
+}
 var mediaRules = [
   findNestedMediaStartBasisFindings,
   findSpeedRampOnNonMediaFindings,
@@ -2165,54 +2212,19 @@ var mediaRules = [
   // video_nested_in_timed_element
   ({ source, tags }) => {
     const findings = [];
-    const voidElements = /* @__PURE__ */ new Set([
-      "area",
-      "base",
-      "br",
-      "col",
-      "embed",
-      "hr",
-      "img",
-      "input",
-      "link",
-      "meta",
-      "source",
-      "track",
-      "wbr"
-    ]);
-    const timedTagPositions = [];
-    for (const tag of tags) {
-      if (tag.name === "video" || tag.name === "audio") continue;
-      if (voidElements.has(tag.name)) continue;
-      if (readDecodedAttr(tag.raw, "data-composition-id")) continue;
-      if (readAttr(tag.raw, "data-start")) {
-        timedTagPositions.push({
-          name: tag.name,
-          start: tag.index,
-          id: readAttr(tag.raw, "id") || void 0
-        });
-      }
-    }
     for (const tag of tags) {
       if (tag.name !== "video") continue;
       if (!readAttr(tag.raw, "data-start")) continue;
-      for (const parent of timedTagPositions) {
-        if (parent.start < tag.index) {
-          const parentClosePattern = new RegExp(`</${parent.name}>`, "gi");
-          const between = source.substring(parent.start, tag.index);
-          if (!parentClosePattern.test(between)) {
-            findings.push({
-              code: "video_nested_in_timed_element",
-              severity: "error",
-              message: `<video> with data-start is nested inside <${parent.name}${parent.id ? ` id="${parent.id}"` : ""}> which also has data-start. The frame extractor resolves the video's start from its own data-start without the wrapper's offset, while visibility uses the wrapper's window, so the two disagree: the clip shows the wrong source frames and then disappears partway through its slot.`,
-              elementId: readAttr(tag.raw, "id") || void 0,
-              fixHint: "Time the wrapper OR the video, never both: remove data-start from the wrapper (use it as a non-timed visual container), or move the <video> up to be a direct child of the stage.",
-              snippet: truncateSnippet(tag.raw)
-            });
-            break;
-          }
-        }
-      }
+      const parent = innermostTimedWrapper(source, tags, tag);
+      if (!parent) continue;
+      findings.push({
+        code: "video_nested_in_timed_element",
+        severity: "error",
+        message: `<video> with data-start is nested inside <${parent.name}${parent.id ? ` id="${parent.id}"` : ""}> which also has data-start. The frame extractor resolves the video's start from its own data-start without the wrapper's offset, while visibility uses the wrapper's window, so the two disagree: the clip shows the wrong source frames and then disappears partway through its slot.`,
+        elementId: readAttr(tag.raw, "id") || void 0,
+        fixHint: "Time the wrapper OR the video, never both: remove data-start from the wrapper (use it as a non-timed visual container), or move the <video> up to be a direct child of the stage.",
+        snippet: truncateSnippet(tag.raw)
+      });
     }
     return findings;
   },
@@ -2280,7 +2292,7 @@ var mediaRules = [
     return findings;
   },
   // media_missing_data_start + media_missing_id + media_missing_src + media_preload_none
-  ({ tags }) => {
+  ({ source, tags }) => {
     const findings = [];
     for (const tag of tags) {
       if (tag.name !== "video" && tag.name !== "audio") continue;
@@ -2288,12 +2300,13 @@ var mediaRules = [
       const hasId = readAttr(tag.raw, "id");
       const hasSrc = mediaHasResolvableSrc(tag, tags);
       if (hasSrc && !hasDataStart) {
+        const wrapper = tag.name === "video" ? innermostTimedWrapper(source, tags, tag) : null;
         findings.push({
           code: "media_missing_data_start",
           severity: "error",
           message: `<${tag.name}${hasId ? ` id="${hasId}"` : ""}> has src but no data-start. HyperFrames cannot own playback for untimed media, so preview and render behavior can diverge.`,
           elementId: hasId || void 0,
-          fixHint: `Add data-start="0" (or the intended start time) and data-duration if the clip should stop before the source ends.`,
+          fixHint: wrapper ? `This <${tag.name}> sits inside the timed <${wrapper.name}${wrapper.id ? ` id="${wrapper.id}"` : ""}> (data-start="${wrapper.start}"), and the wrapper's data-start would then clash. Move the <${tag.name}> out as a direct child of the stage and give it that wrapper's data-start="${wrapper.start}"${wrapper.duration ? ` and data-duration="${wrapper.duration}"` : ""}.` : `Add data-start="0" (or the intended start time) and data-duration if the clip should stop before the source ends.`,
           snippet: truncateSnippet(tag.raw)
         });
       }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hyperframes/lint",
-  "version": "0.8.186",
+  "version": "0.8.188",
   "repository": {
     "type": "git",
     "url": "https://github.com/heygen-com/hyperframes",
@@ -35,7 +35,7 @@
     "linkedom": "^0.18.12",
     "postcss": "^8.5.8",
     "postcss-selector-parser": "^7.1.4",
-    "@hyperframes/parsers": "0.8.186"
+    "@hyperframes/parsers": "0.8.188"
   },
   "devDependencies": {
     "@types/node": "^25.0.10",