@hyperframes/lint 0.8.221 → 0.8.223

package/dist/browser.d.ts

@@ -43,6 +43,13 @@ type HyperframeLinterOptions = {
         file?: string;
         rootRelativePath?: string;
     }>;
+    externalScripts?: Array<{
+        src: string;
+        attrs: string;
+        content: string;
+        file: string;
+        rootRelativePath: string;
+    }>;
     /**
      * Set to `true` when linting compositions destined for distributed / Lambda
      * rendering, where system-font capture (`allowSystemFontCapture`) is
@@ -51,6 +58,7 @@ type HyperframeLinterOptions = {
      * render time — the font will silently fall back to whatever the OS provides.
      */
     distributed?: boolean;
+    projectFontFamilies?: string[];
     /** Who is running the lint: Studio raises the structure rules to errors, the CLI keeps them warnings. */
     host?: "studio" | "cli";
 };

package/dist/browser.js

@@ -786,7 +786,17 @@ function buildLintContext(html, options = {}) {
       rootRelativePath: style.rootRelativePath
     }))
   ];
-  const scripts = structure.scripts;
+  const scripts = [
+    ...structure.scripts,
+    ...(options.externalScripts ?? []).map((script) => ({
+      attrs: script.attrs,
+      content: script.content,
+      raw: script.content,
+      index: -1,
+      file: script.file,
+      rootRelativePath: script.rootRelativePath
+    }))
+  ];
   const compositionIds = collectCompositionIds(tags);
   const rootTag = findRootTag(source, tags);
   const rootCompositionId = readDecodedAttr(rootTag?.raw || "", "data-composition-id");
@@ -1389,7 +1399,10 @@ var coreRules = [
     }
     if (/(?:^|\s)data-no-timeline(?=[\s=/]|$)/i.test(rootTag?.attrs || "")) return [];
     const findings = [];
-    if (!TIMELINE_REGISTRY_INIT_PATTERN.test(source) && !TIMELINE_REGISTRY_ASSIGN_PATTERN.test(source) && !TIMELINE_REGISTRY_OBJECT_LITERAL_PATTERN.test(source)) {
+    const registered = [source, ...(options.externalScripts ?? []).map((script) => script.content)];
+    if (!registered.some(
+      (text) => TIMELINE_REGISTRY_INIT_PATTERN.test(text) || TIMELINE_REGISTRY_ASSIGN_PATTERN.test(text) || TIMELINE_REGISTRY_OBJECT_LITERAL_PATTERN.test(text)
+    )) {
       findings.push({
         code: "missing_timeline_registry",
         severity: "error",
@@ -1560,9 +1573,9 @@ var coreRules = [
   ({ scripts, locate }) => {
     const findings = [];
     for (const script of scripts) {
-      const type = readDecodedAttr(script.raw, "type")?.trim().toLowerCase() ?? "";
-      if (readDecodedAttr(script.raw, "src") !== null || SCRIPT_SYNTAX_EXEMPT_TYPES.has(type))
-        continue;
+      const tag = `<script ${script.attrs}>`;
+      const type = readDecodedAttr(tag, "type")?.trim().toLowerCase() ?? "";
+      if (readDecodedAttr(tag, "src") !== null || SCRIPT_SYNTAX_EXEMPT_TYPES.has(type)) continue;
       const syntaxError = getInlineScriptSyntaxError(script.content);
       if (!syntaxError) continue;
       findings.push({
@@ -6439,6 +6452,9 @@ function extractFontFaceFamilies(styles) {
   }
   return families;
 }
+function declaredFontFamilies(styles, options) {
+  return /* @__PURE__ */ new Set([...extractFontFaceFamilies(styles), ...options.projectFontFamilies ?? []]);
+}
 function normalizeUsedFontName(part) {
   const name = part.trim().replace(/\s*!important\s*$/i, "").replace(/^['"]|['"]$/g, "").trim().toLowerCase();
   if (!name || name.includes("(") || name.includes(")")) return null;
@@ -6548,7 +6564,7 @@ var fontRules = [
   // so there is nothing for the author to act on.
   ({ styles, options }) => {
     if (!options.distributed) return [];
-    const declared = extractFontFaceFamilies(styles);
+    const declared = declaredFontFamilies(styles, options);
     const used = extractUsedFontFamilies(styles);
     const aliased = collectAliasedFonts(used, declared);
     if (aliased.length === 0) return [];
@@ -6564,7 +6580,7 @@ var fontRules = [
   ({ styles, source, rawSource, options, locate }) => {
     if (isRegistrySourceFile(options.filePath) || isRegistryInstalledFile(rawSource)) return [];
     const findings = [];
-    const declared = extractFontFaceFamilies(styles);
+    const declared = declaredFontFamilies(styles, options);
     const used = extractUsedFontFamilies(styles);
     const googleFonts = collectGoogleFontFamilies(source, styles);
     const undeclared = used.filter(

package/dist/index.d.ts

@@ -43,6 +43,13 @@ type HyperframeLinterOptions = {
         file?: string;
         rootRelativePath?: string;
     }>;
+    externalScripts?: Array<{
+        src: string;
+        attrs: string;
+        content: string;
+        file: string;
+        rootRelativePath: string;
+    }>;
     /**
      * Set to `true` when linting compositions destined for distributed / Lambda
      * rendering, where system-font capture (`allowSystemFontCapture`) is
@@ -51,6 +58,7 @@ type HyperframeLinterOptions = {
      * render time — the font will silently fall back to whatever the OS provides.
      */
     distributed?: boolean;
+    projectFontFamilies?: string[];
     /** Who is running the lint: Studio raises the structure rules to errors, the CLI keeps them warnings. */
     host?: "studio" | "cli";
 };

package/dist/index.js

@@ -792,7 +792,17 @@ function buildLintContext(html, options = {}) {
       rootRelativePath: style.rootRelativePath
     }))
   ];
-  const scripts = structure.scripts;
+  const scripts = [
+    ...structure.scripts,
+    ...(options.externalScripts ?? []).map((script) => ({
+      attrs: script.attrs,
+      content: script.content,
+      raw: script.content,
+      index: -1,
+      file: script.file,
+      rootRelativePath: script.rootRelativePath
+    }))
+  ];
   const compositionIds = collectCompositionIds(tags);
   const rootTag = findRootTag(source, tags);
   const rootCompositionId = readDecodedAttr(rootTag?.raw || "", "data-composition-id");
@@ -1395,7 +1405,10 @@ var coreRules = [
     }
     if (/(?:^|\s)data-no-timeline(?=[\s=/]|$)/i.test(rootTag?.attrs || "")) return [];
     const findings = [];
-    if (!TIMELINE_REGISTRY_INIT_PATTERN.test(source) && !TIMELINE_REGISTRY_ASSIGN_PATTERN.test(source) && !TIMELINE_REGISTRY_OBJECT_LITERAL_PATTERN.test(source)) {
+    const registered = [source, ...(options.externalScripts ?? []).map((script) => script.content)];
+    if (!registered.some(
+      (text) => TIMELINE_REGISTRY_INIT_PATTERN.test(text) || TIMELINE_REGISTRY_ASSIGN_PATTERN.test(text) || TIMELINE_REGISTRY_OBJECT_LITERAL_PATTERN.test(text)
+    )) {
       findings.push({
         code: "missing_timeline_registry",
         severity: "error",
@@ -1566,9 +1579,9 @@ var coreRules = [
   ({ scripts, locate }) => {
     const findings = [];
     for (const script of scripts) {
-      const type = readDecodedAttr(script.raw, "type")?.trim().toLowerCase() ?? "";
-      if (readDecodedAttr(script.raw, "src") !== null || SCRIPT_SYNTAX_EXEMPT_TYPES.has(type))
-        continue;
+      const tag = `<script ${script.attrs}>`;
+      const type = readDecodedAttr(tag, "type")?.trim().toLowerCase() ?? "";
+      if (readDecodedAttr(tag, "src") !== null || SCRIPT_SYNTAX_EXEMPT_TYPES.has(type)) continue;
       const syntaxError = getInlineScriptSyntaxError(script.content);
       if (!syntaxError) continue;
       findings.push({
@@ -6445,6 +6458,9 @@ function extractFontFaceFamilies(styles) {
   }
   return families;
 }
+function declaredFontFamilies(styles, options) {
+  return /* @__PURE__ */ new Set([...extractFontFaceFamilies(styles), ...options.projectFontFamilies ?? []]);
+}
 function normalizeUsedFontName(part) {
   const name = part.trim().replace(/\s*!important\s*$/i, "").replace(/^['"]|['"]$/g, "").trim().toLowerCase();
   if (!name || name.includes("(") || name.includes(")")) return null;
@@ -6554,7 +6570,7 @@ var fontRules = [
   // so there is nothing for the author to act on.
   ({ styles, options }) => {
     if (!options.distributed) return [];
-    const declared = extractFontFaceFamilies(styles);
+    const declared = declaredFontFamilies(styles, options);
     const used = extractUsedFontFamilies(styles);
     const aliased = collectAliasedFonts(used, declared);
     if (aliased.length === 0) return [];
@@ -6570,7 +6586,7 @@ var fontRules = [
   ({ styles, source, rawSource, options, locate }) => {
     if (isRegistrySourceFile(options.filePath) || isRegistryInstalledFile(rawSource)) return [];
     const findings = [];
-    const declared = extractFontFaceFamilies(styles);
+    const declared = declaredFontFamilies(styles, options);
     const used = extractUsedFontFamilies(styles);
     const googleFonts = collectGoogleFontFamilies(source, styles);
     const undeclared = used.filter(
@@ -7489,6 +7505,30 @@ function collectExternalStyles(projectDir, html, compSrcPath) {
   }
   return styles;
 }
+var MAX_EXTERNAL_SCRIPT_BYTES = 1e6;
+function collectExternalScripts(projectDir, html, compSrcPath) {
+  const scripts = [];
+  const { document } = parseHTML3(html);
+  for (const element of querySelectorAllIncludingTemplates(document, "script[src]")) {
+    const src = element.getAttribute("src") ?? "";
+    if (!isLocalStylesheetHref(src) || /\.min\.m?js(?:[?#]|$)/i.test(src)) continue;
+    const path = src.split(/[?#]/)[0] ?? src;
+    const besideFile = compSrcPath ? join3(dirname2(compSrcPath), path) : path;
+    const script = resolveExistingLocalAsset3(projectDir, besideFile) ?? (compSrcPath && staysInsideProjectRoot(path) ? resolveExistingLocalAsset3(projectDir, path) : null);
+    if (!script) continue;
+    const read = readProjectFile2(script.resolved);
+    if (read.kind !== "file" || read.text.length > MAX_EXTERNAL_SCRIPT_BYTES) continue;
+    const attrs = Array.from(element.attributes).map(({ name, value }) => `${name}="${value.replace(/&/g, "&amp;").replace(/"/g, "&quot;")}"`).join(" ");
+    scripts.push({
+      src,
+      attrs,
+      content: read.text,
+      file: join3(projectDir, script.rootRelativePath),
+      rootRelativePath: script.rootRelativePath
+    });
+  }
+  return scripts;
+}
 function collectCssSources(projectDir, html, compSrcPath) {
   const sources = [];
   const { document } = parseHTML3(html);
@@ -7522,6 +7562,42 @@ function resolveCssAssetCandidates(projectDir, url, htmlCompSrcPath, cssRootRela
   }
   return resolveLocalAssetCandidates(projectDir, url);
 }
+function mountedSources(projectDir, rootHtml, rootCompSrcPath) {
+  const sources = [{ html: rootHtml, compSrcPath: rootCompSrcPath }];
+  const seen = /* @__PURE__ */ new Set();
+  for (const source of sources) {
+    const { document } = parseHTML3(source.html);
+    for (const host of querySelectorAllIncludingTemplates(document, "[data-composition-src]")) {
+      const src = host.getAttribute("data-composition-src")?.trim();
+      if (!src || isUnresolvedAssetPlaceholder2(src) || isRemoteOrInlineUrl2(src)) continue;
+      const path = resolve(projectDir, src);
+      if (seen.has(path) || !isWithinProjectRoot2(projectDir, path)) continue;
+      seen.add(path);
+      const read = readProjectFile2(path);
+      if (read.kind !== "file") continue;
+      sources.push({
+        html: read.text,
+        compSrcPath: relative2(resolve(projectDir), path).replace(/\\/g, "/")
+      });
+    }
+  }
+  return sources;
+}
+function declaredProjectFontFamilies(projectDir, sources) {
+  const families = /* @__PURE__ */ new Set();
+  for (const { html, compSrcPath } of sources) {
+    const { document } = parseHTML3(html);
+    const styles = [
+      ...querySelectorAllIncludingTemplates(document, "style").map((style) => ({
+        content: style.textContent ?? ""
+      })),
+      ...collectLocalStylesheets(projectDir, document, compSrcPath)
+    ];
+    for (const family of extractFontFaceFamilies(styles)) families.add(family);
+    for (const family of collectGoogleFontFamilies(html, styles)) families.add(family);
+  }
+  return [...families];
+}
 async function lintProject(projectDir, entryFile, hostOptions = {}) {
   const indexPath = entryFile ? resolve(entryFile) : resolve(projectDir, "index.html");
   if (entryFile && !isWithinProjectRoot2(projectDir, indexPath)) {
@@ -7534,11 +7610,17 @@ async function lintProject(projectDir, entryFile, hostOptions = {}) {
   let totalWarnings = 0;
   let totalInfos = 0;
   const rootHtml = readFileSync(indexPath, "utf-8");
+  const projectFontFamilies = declaredProjectFontFamilies(
+    projectDir,
+    mountedSources(projectDir, rootHtml, rootCompSrcPath)
+  );
   const rootResult = await lintHyperframeHtml(rootHtml, {
     ...hostOptions,
     filePath: indexPath,
     compSrcPath: rootFile,
-    externalStyles: collectExternalStyles(projectDir, rootHtml, rootCompSrcPath)
+    externalStyles: collectExternalStyles(projectDir, rootHtml, rootCompSrcPath),
+    projectFontFamilies,
+    externalScripts: collectExternalScripts(projectDir, rootHtml, rootCompSrcPath)
   });
   results.push({ file: rootFile, result: rootResult, contentHash: contentDigest(rootHtml) });
   totalErrors += rootResult.errorCount;
@@ -7572,7 +7654,9 @@ async function lintProject(projectDir, entryFile, hostOptions = {}) {
         filePath,
         isSubComposition: true,
         compSrcPath,
-        externalStyles: collectExternalStyles(projectDir, html, compSrcPath)
+        externalStyles: collectExternalStyles(projectDir, html, compSrcPath),
+        projectFontFamilies,
+        externalScripts: collectExternalScripts(projectDir, html, compSrcPath)
       });
       results.push({
         file: `compositions/${file}`,
@@ -7590,6 +7674,7 @@ async function lintProject(projectDir, entryFile, hostOptions = {}) {
     ...lintAudioSrcNotFound(projectDir, allHtmlSources),
     ...lintMissingLocalAsset(projectDir, allHtmlSources),
     ...lintTextureMaskAssetNotFound(projectDir, allHtmlSources),
+    ...lintLinkedStylesheetAssets(projectDir, allHtmlSources),
     ...!entryFile ? lintMultipleRootCompositions(projectDir) : [],
     ...!entryFile ? lintBlankRootWithStandaloneComposition(rootHtml, allHtmlSources) : [],
     ...lintDuplicateAudioTracks(projectDir, rootHtml),
@@ -7799,6 +7884,62 @@ function lintTextureMaskAssetNotFound(projectDir, htmlSources) {
     };
   });
 }
+function nearestAncestorMatch(projectDir, cssRootRelativePath, url) {
+  const root = resolve(projectDir);
+  for (let dir = resolve(root, dirname2(cssRootRelativePath), ".."); ; dir = dirname2(dir)) {
+    if (!isWithinProjectRoot2(projectDir, dir)) return null;
+    if (resolveLocalAssetCandidates(projectDir, relative2(root, join3(dir, url))).some(existsSync2)) {
+      return relative2(dirname2(resolve(root, cssRootRelativePath)), join3(dir, url)).replace(
+        /\\/g,
+        "/"
+      );
+    }
+    if (dir === root) return null;
+  }
+}
+function lintLinkedStylesheetAssets(projectDir, htmlSources) {
+  const seen = /* @__PURE__ */ new Set();
+  const findings = [];
+  for (const { html, compSrcPath } of htmlSources) {
+    for (const { content, rootRelativePath } of collectLocalStylesheets(
+      projectDir,
+      parseHTML3(html).document,
+      compSrcPath
+    )) {
+      let root;
+      try {
+        root = postcss4.parse(content);
+      } catch (error) {
+        if (!(error instanceof postcss4.CssSyntaxError)) throw error;
+        continue;
+      }
+      root.walkDecls((declaration) => {
+        if (/^(?:-webkit-)?mask-image$/i.test(declaration.prop)) return;
+        for (const match of declaration.value.matchAll(CSS_URL_RE)) {
+          const rawUrl = match[1] ?? match[2] ?? match[3] ?? "";
+          if (isUnresolvedAssetPlaceholder2(rawUrl)) continue;
+          const url = cleanAssetUrl2(rawUrl);
+          if (!url || isRemoteOrInlineUrl2(url) || url.startsWith("/")) continue;
+          if (resolveCssAssetCandidates(projectDir, url, void 0, rootRelativePath).some(existsSync2))
+            continue;
+          const key = `${rootRelativePath}\0${url}`;
+          if (seen.has(key)) continue;
+          seen.add(key);
+          const found = nearestAncestorMatch(projectDir, rootRelativePath, url);
+          findings.push({
+            code: "missing_stylesheet_asset",
+            severity: "warning",
+            file: join3(projectDir, rootRelativePath),
+            message: `${rootRelativePath} references url(${url}), which is not found beside the stylesheet (looked in ${dirname2(rootRelativePath)}/). The browser resolves url() from the stylesheet, so the file will 404.`,
+            fixHint: found ? `A file exists at "${found}" relative to the stylesheet. Change the url() to that path.` : `Add "${url}" beside the stylesheet, or point the url() at an existing file.`
+          });
+        }
+      });
+    }
+  }
+  return findings;
+}
+var PAGES_OPENED_BESIDE_INDEX = /* @__PURE__ */ new Set(["caption-skin.html", "podcast-lanes.html"]);
 function lintMultipleRootCompositions(projectDir) {
   const findings = [];
   try {
@@ -7807,7 +7948,7 @@ function lintMultipleRootCompositions(projectDir) {
     );
     const rootCompositions = [];
     for (const file of rootHtmlFiles) {
-      if (file === "caption-skin.html") continue;
+      if (PAGES_OPENED_BESIDE_INDEX.has(file)) continue;
       const content = readFileSync(join3(projectDir, file), "utf-8");
       if (/data-composition-id/i.test(content)) {
         rootCompositions.push(file);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hyperframes/lint",
-  "version": "0.8.221",
+  "version": "0.8.223",
   "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.221"
+    "@hyperframes/parsers": "0.8.223"
   },
   "devDependencies": {
     "@types/node": "^25.0.10",