Merge pull request #8502 from francisbeaudoin/fix-static-asset-script-src

Allow static theme asset script URLs in app doctor

Author: dmerand

.changeset/quiet-assets-repair.md

@@ -0,0 +1,5 @@
+---
+'@shopify/app': patch
+---
+
+Avoid flagging static theme asset script tags in app doctor.

packages/app/src/cli/services/app-doctor-engine/rules/liquid-rules.ts

@@ -66,6 +66,7 @@ function liquidExecutableContextVisitor(file: SourceFile) {
       const context = liquidOutputContext(ancestors)
       if (context !== 'javascript' && context !== 'executable_attribute') return undefined
       if (context === 'javascript' && filterNames(node).includes('json')) return undefined
+      if (isStaticScriptAssetUrl(node, ancestors)) return undefined
       return [
         makeLiquidIssue(
           'UNSAFE_INNERHTML',
@@ -118,6 +119,14 @@ function attributeName(attribute: AttributeNode): string {
   return attribute.name.map((part) => ('value' in part && typeof part.value === 'string' ? part.value : '')).join('')
 }
 
+function isStaticScriptAssetUrl(node: LiquidVariableOutput, ancestors: LiquidHtmlNode[]): boolean {
+  const script = ancestors.find((ancestor) => ancestor.type === 'HtmlRawNode' && ancestor.name === 'script')
+  const attribute = ancestors.find((ancestor): ancestor is AttributeNode => ancestor.type.startsWith('Attr'))
+  if (!script || !attribute || attributeName(attribute).toLowerCase() !== 'src') return false
+
+  return /^(['"])(?:\\.|(?!\1)[^\\\n])+\1\s*\|\s*asset_url\s*$/.test(outputSource(node).trim())
+}
+
 function outputSource(node: LiquidVariableOutput): string {
   return typeof node.markup === 'string' ? node.markup : node.markup.rawSource
 }

packages/app/src/cli/services/app-doctor-engine/tests/rule-analysis.test.ts

@@ -1084,8 +1084,16 @@ describe('Liquid public AST analysis', () => {
     ])
     expect(ordinary.issues).toEqual([])
 
+    const staticAsset = scanLiquidSecurity([
+      source('<script src="{{ \'chat.js\' | asset_url }}" defer></script>', 'extensions/theme/blocks/chat.liquid'),
+    ])
+    expect(staticAsset.issues).toEqual([])
+
     const script = scanLiquidSecurity([
-      source('<script src="{{ block.settings.script | escape }}"></script>', 'extensions/theme/blocks/script.liquid'),
+      source(
+        '<script src="{{ block.settings.script | asset_url }}"></script>',
+        'extensions/theme/blocks/script.liquid',
+      ),
     ])
     expect(script.issues.map((finding) => finding.id)).toEqual(['LIQUID_UNSAFE_RENDER', 'UNSAFE_INNERHTML'])
   })