td-ai-tools 1.2.5 → 1.2.8

package/skills/shopify-lint/theme-check-theory/src/checks/hardcoded-text.test.ts

@@ -0,0 +1,147 @@
+import {
+  runLiquidCheck,
+} from '@shopify/theme-check-common/dist/test/test-helper';
+import { describe, expect, it } from 'vitest';
+
+import { HardcodedText } from './hardcoded-text';
+
+describe('HardcodedText', () => {
+  it('reports rendered text and direct string output', async () => {
+    const source = `
+      Welcome to our store
+      <h2>Featured products</h2>
+      {{ 'Limited edition' }}
+      {% echo "Shop now" %}
+    `;
+
+    const offenses = await runLiquidCheck(HardcodedText, source);
+
+    expect(offenses).toHaveLength(4);
+    expect(
+      offenses.every(({ check }) => check === 'HardcodedText'),
+    ).toBe(true);
+    expect(
+      offenses.every(
+        ({ message }) =>
+          message ===
+          'Replace hard-coded text with a section setting, translation key, metafield, or metaobject',
+      ),
+    ).toBe(true);
+  });
+
+  it('reports hard-coded text in common user-facing attributes', async () => {
+    const source = `
+      <img src="{{ image | image_url }}" alt="Product photo">
+      <button title='Close dialog' aria-label="Close">×</button>
+      <input placeholder="Email address">
+    `;
+
+    const offenses = await runLiquidCheck(HardcodedText, source);
+
+    expect(offenses).toHaveLength(4);
+  });
+
+  it('reports labels in button-like input value attributes', async () => {
+    const source = `
+      <input type="submit" value="Search">
+      <input type=button value='Add to cart'>
+      <input type='RESET' value="Clear form">
+    `;
+
+    const offenses = await runLiquidCheck(HardcodedText, source);
+
+    expect(offenses).toHaveLength(3);
+  });
+
+  it('ignores value attributes that are not rendered as labels', async () => {
+    const source = `
+      <input type="hidden" value="technical-id">
+      <input type="text" value="Initial form value">
+      <button value="submitted-value">{{ button_label }}</button>
+    `;
+
+    expect(await runLiquidCheck(HardcodedText, source)).toEqual([]);
+  });
+
+  it('reports static fragments in otherwise dynamic rendered text', async () => {
+    const source = `
+      <p>Welcome, {{ customer.name }}!</p>
+      <img alt="Photo of {{ product.title }}" src="{{ product.featured_image | image_url }}">
+    `;
+
+    const offenses = await runLiquidCheck(HardcodedText, source);
+
+    expect(offenses).toHaveLength(2);
+  });
+
+  it('reports hard-coded default filter fallbacks', async () => {
+    const source = `
+      {{ product.title | default: 'Free shipping on all orders' }}
+      {% echo section.settings.label | default: "Shop now" %}
+      {{ translated_title | t | default: 'Fallback after translation' }}
+    `;
+
+    const offenses = await runLiquidCheck(HardcodedText, source);
+
+    expect(offenses).toHaveLength(3);
+  });
+
+  it('accepts settings, translation keys, metafields, and metaobjects', async () => {
+    const source = `
+      <h2>{{ section.settings.heading }}</h2>
+      <p>{{ 'general.welcome' | t }}</p>
+      <p>{{ "general.subtitle" | translate }}</p>
+      <p>{{ product.metafields.content.description }}</p>
+      <p>{{ metaobjects.testimonials.homepage.quote }}</p>
+      <p>{{ product.title | default: 'products.fallback' | t }}</p>
+      <img alt="{{ section.settings.image_alt }}" src="{{ section.settings.image | image_url }}">
+    `;
+
+    expect(await runLiquidCheck(HardcodedText, source)).toEqual([]);
+  });
+
+  it('ignores entity-only text while still reporting surrounding copy', async () => {
+    const entities = `
+      &nbsp; &times; &mdash; &hellip; &copy; &#169; &#x00a0;
+    `;
+    const copy = '&nbsp;Welcome&nbsp;';
+
+    expect(await runLiquidCheck(HardcodedText, entities)).toEqual([]);
+    expect(await runLiquidCheck(HardcodedText, copy)).toHaveLength(1);
+  });
+
+  it.each([
+    [
+      'stylesheet',
+      '{% stylesheet %}.card::after { content: "Hard coded"; }{% endstylesheet %}',
+    ],
+    [
+      'javascript',
+      '{% javascript %}console.log("Hard coded");{% endjavascript %}',
+    ],
+    [
+      'schema',
+      '{% schema %}{"name":"Hard coded","settings":[]}{% endschema %}',
+    ],
+  ])('ignores text inside the %s raw tag', async (_, source) => {
+    expect(await runLiquidCheck(HardcodedText, source)).toEqual([]);
+  });
+
+  it('ignores comments, technical attributes, punctuation, and Liquid logic strings', async () => {
+    const source = `
+      <!-- Hard coded HTML comment -->
+      {% comment %}Hard coded Liquid comment{% endcomment %}
+      <div class="hard-coded" id="hard-coded" data-label="Hard coded">—</div>
+      {% assign state = 'active' %}
+      {% if request.page_type == 'product' %}{{ product.title }}{% endif %}
+    `;
+
+    expect(await runLiquidCheck(HardcodedText, source)).toEqual([]);
+  });
+
+  it('still reports rendered text inside other raw tags', async () => {
+    const source = '{% raw %}Hard coded raw output{% endraw %}';
+
+    expect(await runLiquidCheck(HardcodedText, source)).toHaveLength(1);
+  });
+});

package/skills/shopify-lint/theme-check-theory/src/checks/hardcoded-text.ts

@@ -0,0 +1,243 @@
+import {
+  NodeTypes,
+} from '@shopify/liquid-html-parser';
+import type {
+  AttributeNode,
+  HtmlVoidElement,
+  LiquidHtmlNode,
+  LiquidRawTag,
+  LiquidString,
+  LiquidVariable,
+  TextNode,
+} from '@shopify/liquid-html-parser';
+import {
+  LiquidCheckDefinition,
+  Severity,
+  SourceCodeType,
+} from '@shopify/theme-check-common';
+
+const EXEMPT_RAW_TAGS = new Set([
+  'comment',
+  'javascript',
+  'schema',
+  'stylesheet',
+]);
+
+const TEXT_ATTRIBUTES = new Set([
+  'alt',
+  'aria-description',
+  'aria-label',
+  'aria-placeholder',
+  'placeholder',
+  'title',
+]);
+
+const TRANSLATION_FILTERS = new Set(['t', 'translate']);
+
+const BUTTON_INPUT_TYPES = new Set(['button', 'reset', 'submit']);
+
+const HTML_CHARACTER_REFERENCE =
+  /&(?:#\d+|#x[\da-f]+|[a-z][\da-z]+);/giu;
+
+type ValuedAttribute = Extract<AttributeNode, { value: unknown }>;
+
+function isValuedAttribute(node: LiquidHtmlNode): node is ValuedAttribute {
+  return (
+    node.type === NodeTypes.AttrDoubleQuoted ||
+    node.type === NodeTypes.AttrSingleQuoted ||
+    node.type === NodeTypes.AttrUnquoted
+  );
+}
+
+function staticAttributeName(node: ValuedAttribute): string | undefined {
+  if (
+    node.name.length !== 1 ||
+    node.name[0].type !== NodeTypes.TextNode
+  ) {
+    return undefined;
+  }
+
+  return node.name[0].value.toLowerCase();
+}
+
+function staticAttributeValue(node: ValuedAttribute): string | undefined {
+  if (
+    node.value.length !== 1 ||
+    node.value[0].type !== NodeTypes.TextNode
+  ) {
+    return undefined;
+  }
+
+  return node.value[0].value.toLowerCase();
+}
+
+function staticInputType(node: HtmlVoidElement): string | undefined {
+  for (const attribute of node.attributes) {
+    if (
+      isValuedAttribute(attribute) &&
+      staticAttributeName(attribute) === 'type'
+    ) {
+      return staticAttributeValue(attribute);
+    }
+  }
+
+  return undefined;
+}
+
+function isInputButtonValue(ancestors: LiquidHtmlNode[]): boolean {
+  let element: HtmlVoidElement | undefined;
+  for (let index = ancestors.length - 1; index >= 0; index -= 1) {
+    const ancestor = ancestors[index];
+    if (ancestor.type === NodeTypes.HtmlVoidElement) {
+      element = ancestor;
+      break;
+    }
+  }
+
+  return (
+    element?.name.toLowerCase() === 'input' &&
+    BUTTON_INPUT_TYPES.has(staticInputType(element) ?? '')
+  );
+}
+
+function rawTagAncestor(
+  ancestors: LiquidHtmlNode[],
+): LiquidRawTag | undefined {
+  for (let index = ancestors.length - 1; index >= 0; index -= 1) {
+    const ancestor = ancestors[index];
+    if (ancestor.type === NodeTypes.LiquidRawTag) return ancestor;
+  }
+
+  return undefined;
+}
+
+function hasMeaningfulText(value: string): boolean {
+  return /[\p{L}\p{N}]/u.test(
+    value.replace(HTML_CHARACTER_REFERENCE, ''),
+  );
+}
+
+function isHtmlElementName(node: TextNode, parent: LiquidHtmlNode): boolean {
+  if (
+    parent.type !== NodeTypes.HtmlElement &&
+    parent.type !== NodeTypes.HtmlSelfClosingElement
+  ) {
+    return false;
+  }
+
+  return parent.name.some((part) => part === node);
+}
+
+function isTranslation(variable: LiquidVariable): boolean {
+  return variable.filters.some(({ name }) => TRANSLATION_FILTERS.has(name));
+}
+
+export const HardcodedText: LiquidCheckDefinition = {
+  meta: {
+    code: 'HardcodedText',
+    name: 'Prevent hard-coded storefront text',
+    docs: {
+      description:
+        'Reports rendered text that should come from a setting, translation, metafield, or metaobject.',
+      recommended: true,
+    },
+    type: SourceCodeType.LiquidHtml,
+    severity: Severity.WARNING,
+    schema: {},
+  },
+  create(context) {
+    function report(startIndex: number, endIndex: number) {
+      context.report({
+        message:
+          'Replace hard-coded text with a section setting, translation key, metafield, or metaobject',
+        startIndex,
+        endIndex,
+      });
+    }
+
+    function reportString(string: LiquidString) {
+      if (!hasMeaningfulText(string.value)) return;
+      report(string.position.start, string.position.end);
+    }
+
+    function reportLiteralOutput(variable: LiquidVariable) {
+      if (
+        variable.expression.type === NodeTypes.String &&
+        !isTranslation(variable)
+      ) {
+        reportString(variable.expression);
+      }
+
+      for (
+        let filterIndex = 0;
+        filterIndex < variable.filters.length;
+        filterIndex += 1
+      ) {
+        const filter = variable.filters[filterIndex];
+        if (filter.name !== 'default') continue;
+
+        const fallbackIsTranslated = variable.filters
+          .slice(filterIndex + 1)
+          .some(({ name }) => TRANSLATION_FILTERS.has(name));
+        if (fallbackIsTranslated) continue;
+
+        for (const argument of filter.args) {
+          if (argument.type === NodeTypes.String) {
+            reportString(argument);
+          }
+        }
+      }
+    }
+
+    return {
+      async TextNode(node, ancestors) {
+        if (!hasMeaningfulText(node.value)) return;
+
+        const rawTag = rawTagAncestor(ancestors);
+        if (rawTag) {
+          if (EXEMPT_RAW_TAGS.has(rawTag.name.toLowerCase())) return;
+          report(node.position.start, node.position.end);
+          return;
+        }
+
+        const parent = ancestors.at(-1);
+        if (!parent || isHtmlElementName(node, parent)) return;
+
+        if (isValuedAttribute(parent)) {
+          if (!parent.value.some((part) => part === node)) return;
+
+          const attributeName = staticAttributeName(parent);
+          if (
+            (attributeName && TEXT_ATTRIBUTES.has(attributeName)) ||
+            (attributeName === 'value' &&
+              isInputButtonValue(ancestors))
+          ) {
+            report(node.position.start, node.position.end);
+          }
+          return;
+        }
+
+        if (parent.type === NodeTypes.RawMarkup) return;
+
+        if (
+          parent.type === NodeTypes.Document ||
+          parent.type === NodeTypes.HtmlElement ||
+          parent.type === NodeTypes.LiquidBranch ||
+          parent.type === NodeTypes.LiquidTag
+        ) {
+          report(node.position.start, node.position.end);
+        }
+      },
+
+      async LiquidVariableOutput(node) {
+        if (typeof node.markup === 'string') return;
+        reportLiteralOutput(node.markup);
+      },
+
+      async LiquidTag(node) {
+        if (node.name !== 'echo' || typeof node.markup === 'string') return;
+        reportLiteralOutput(node.markup);
+      },
+    };
+  },
+};

package/skills/shopify-lint/theme-check-theory/src/checks/unguarded-metafield.test.ts

@@ -0,0 +1,76 @@
+import {
+  runLiquidCheck,
+} from '@shopify/theme-check-common/dist/test/test-helper';
+import { describe, expect, it } from 'vitest';
+
+import { UnguardedMetafield } from './unguarded-metafield';
+
+describe('UnguardedMetafield', () => {
+  it('reports metafield objects and their descendant values', async () => {
+    const source = `
+      {{ product.metafields.details.subtitle }}
+      {{ product.metafields.details.subtitle.value }}
+      {{ collection.metafields['details']['hero'].value }}
+    `;
+
+    const offenses = await runLiquidCheck(UnguardedMetafield, source);
+
+    expect(offenses).toHaveLength(3);
+    expect(offenses[0].message).toBe(
+      "The metafield 'product.metafields.details.subtitle' can be nil and is output without a presence guard or default",
+    );
+  });
+
+  it.each([
+    [
+      'if',
+      '{% if product.metafields.details.subtitle %}{{ product.metafields.details.subtitle.value }}{% endif %}',
+    ],
+    [
+      'unless',
+      '{% unless product.metafields.details.subtitle == blank %}{{ product.metafields.details.subtitle.value }}{% endunless %}',
+    ],
+    [
+      'descendant value',
+      '{% if product.metafields.details.subtitle.value %}{{ product.metafields.details.subtitle.value }}{% endif %}',
+    ],
+  ])('accepts a metafield tested in an %s guard', async (_, source) => {
+    expect(await runLiquidCheck(UnguardedMetafield, source)).toEqual([]);
+  });
+
+  it('accepts a default filter on the output', async () => {
+    const source =
+      "{{ product.metafields.details.subtitle.value | default: 'Not provided' }}";
+
+    expect(await runLiquidCheck(UnguardedMetafield, source)).toEqual([]);
+  });
+
+  it('does not mistake a different metafield guard for the output guard', async () => {
+    const source = `
+      {% if product.metafields.details.title %}
+        {{ product.metafields.details.subtitle.value }}
+      {% endif %}
+    `;
+
+    expect(await runLiquidCheck(UnguardedMetafield, source)).toHaveLength(1);
+  });
+
+  it('ignores namespace collections and dynamic accesses', async () => {
+    const source = `
+      {{ product.metafields }}
+      {{ product.metafields.details }}
+      {{ product.metafields[namespace][key].value }}
+    `;
+
+    expect(await runLiquidCheck(UnguardedMetafield, source)).toEqual([]);
+  });
+
+  it('only considers variable output tags', async () => {
+    const source = `
+      {% assign subtitle = product.metafields.details.subtitle.value %}
+      {% echo product.metafields.details.subtitle.value %}
+    `;
+
+    expect(await runLiquidCheck(UnguardedMetafield, source)).toEqual([]);
+  });
+});

package/skills/shopify-lint/theme-check-theory/src/checks/unguarded-metafield.ts

@@ -0,0 +1,49 @@
+import {
+  NodeTypes,
+} from '@shopify/liquid-html-parser';
+import type {
+  LiquidVariableLookup,
+} from '@shopify/liquid-html-parser';
+
+import {
+  createNullableOutputCheck,
+} from '../utils/nullable-output-check';
+import type {
+  NullableObjectReference,
+} from '../utils/nullable-output-check';
+
+export const UnguardedMetafield = createNullableOutputCheck({
+  code: 'UnguardedMetafield',
+  name: 'Require guards for metafields',
+  description:
+    'Reports metafield output without a presence guard or default filter.',
+  objectName: 'metafield',
+  getReference: getMetafieldReference,
+});
+
+function getMetafieldReference(
+  node: LiquidVariableLookup,
+): NullableObjectReference | undefined {
+  if (!node.name) return undefined;
+
+  const [metafields, namespace, key] = node.lookups;
+  if (
+    metafields?.type !== NodeTypes.String ||
+    metafields.value !== 'metafields' ||
+    namespace?.type !== NodeTypes.String ||
+    key?.type !== NodeTypes.String
+  ) {
+    return undefined;
+  }
+
+  const name = `${node.name}.metafields.${namespace.value}.${key.value}`;
+  return {
+    key: JSON.stringify([
+      'metafield',
+      node.name,
+      namespace.value,
+      key.value,
+    ]),
+    name,
+  };
+}

package/skills/shopify-lint/theme-check-theory/src/checks/unguarded-metaobject.test.ts

@@ -0,0 +1,77 @@
+import {
+  runLiquidCheck,
+} from '@shopify/theme-check-common/dist/test/test-helper';
+import { describe, expect, it } from 'vitest';
+
+import { UnguardedMetaobject } from './unguarded-metaobject';
+
+describe('UnguardedMetaobject', () => {
+  it('reports metaobject entries and their descendant fields', async () => {
+    const source = `
+      {{ metaobjects.testimonials.homepage }}
+      {{ metaobjects.testimonials.homepage.title }}
+      {{ metaobjects['highlights']['washable'].image.value }}
+    `;
+
+    const offenses = await runLiquidCheck(UnguardedMetaobject, source);
+
+    expect(offenses).toHaveLength(3);
+    expect(offenses[0].message).toBe(
+      "The metaobject 'metaobjects.testimonials.homepage' can be nil and is output without a presence guard or default",
+    );
+  });
+
+  it.each([
+    [
+      'if',
+      '{% if metaobjects.testimonials.homepage %}{{ metaobjects.testimonials.homepage.title.value }}{% endif %}',
+    ],
+    [
+      'unless',
+      '{% unless metaobjects.testimonials.homepage == nil %}{{ metaobjects.testimonials.homepage.title.value }}{% endunless %}',
+    ],
+    [
+      'descendant field',
+      '{% if metaobjects.testimonials.homepage.title.value %}{{ metaobjects.testimonials.homepage.title.value }}{% endif %}',
+    ],
+  ])('accepts a metaobject tested in an %s guard', async (_, source) => {
+    expect(await runLiquidCheck(UnguardedMetaobject, source)).toEqual([]);
+  });
+
+  it('accepts a default filter on the output', async () => {
+    const source =
+      "{{ metaobjects.testimonials.homepage.title.value | default: 'Untitled' }}";
+
+    expect(await runLiquidCheck(UnguardedMetaobject, source)).toEqual([]);
+  });
+
+  it('does not mistake a different metaobject guard for the output guard', async () => {
+    const source = `
+      {% if metaobjects.testimonials.featured %}
+        {{ metaobjects.testimonials.homepage.title.value }}
+      {% endif %}
+    `;
+
+    expect(await runLiquidCheck(UnguardedMetaobject, source)).toHaveLength(1);
+  });
+
+  it('ignores type collections, dynamic accesses, and the current template metaobject', async () => {
+    const source = `
+      {{ metaobjects }}
+      {{ metaobjects.testimonials }}
+      {{ metaobjects[type][handle].title.value }}
+      {{ metaobject.title.value }}
+    `;
+
+    expect(await runLiquidCheck(UnguardedMetaobject, source)).toEqual([]);
+  });
+
+  it('only considers variable output tags', async () => {
+    const source = `
+      {% assign testimonial = metaobjects.testimonials.homepage %}
+      {% echo metaobjects.testimonials.homepage.title.value %}
+    `;
+
+    expect(await runLiquidCheck(UnguardedMetaobject, source)).toEqual([]);
+  });
+});

package/skills/shopify-lint/theme-check-theory/src/checks/unguarded-metaobject.ts

@@ -0,0 +1,42 @@
+import {
+  NodeTypes,
+} from '@shopify/liquid-html-parser';
+import type {
+  LiquidVariableLookup,
+} from '@shopify/liquid-html-parser';
+
+import {
+  createNullableOutputCheck,
+} from '../utils/nullable-output-check';
+import type {
+  NullableObjectReference,
+} from '../utils/nullable-output-check';
+
+export const UnguardedMetaobject = createNullableOutputCheck({
+  code: 'UnguardedMetaobject',
+  name: 'Require guards for metaobjects',
+  description:
+    'Reports metaobject output without a presence guard or default filter.',
+  objectName: 'metaobject',
+  getReference: getMetaobjectReference,
+});
+
+function getMetaobjectReference(
+  node: LiquidVariableLookup,
+): NullableObjectReference | undefined {
+  if (node.name !== 'metaobjects') return undefined;
+
+  const [type, handle] = node.lookups;
+  if (
+    type?.type !== NodeTypes.String ||
+    handle?.type !== NodeTypes.String
+  ) {
+    return undefined;
+  }
+
+  const name = `metaobjects.${type.value}.${handle.value}`;
+  return {
+    key: JSON.stringify(['metaobject', type.value, handle.value]),
+    name,
+  };
+}