// Regression test for META-001 (2026-05-19) — ESLint plugin `no-inline-svg`
// must catch the same inline-svg cases that scripts/audit-product-code.mjs R1
// catches. Prior to fix, Vue SFC <template> <svg> was missed entirely.
//
// See docs/internal/retrospection/2026-05-19-consumer-verification-microapps.md.

import { describe, expect, it } from 'vitest'
import { Linter } from 'eslint'
import vueParser from 'vue-eslint-parser'
// @ts-expect-error — plain ESM JS plugin without .d.ts
import tvuPlugin from '../eslint-plugin/index.js'

function lintVue(code: string) {
  const linter = new Linter()
  return linter.verify(
    code,
    {
      files: ['**/*.vue'],
      languageOptions: {
        parser: vueParser as any,
        ecmaVersion: 'latest',
        sourceType: 'module',
      },
      plugins: { '@nancyzeng0210/tvu-design-system': tvuPlugin as any },
      rules: {
        '@nancyzeng0210/tvu-design-system/no-inline-svg': 'error',
      },
    },
    { filename: 'test.vue' }
  )
}

function lintJs(code: string) {
  const linter = new Linter()
  return linter.verify(
    code,
    {
      files: ['**/*.js'],
      languageOptions: { ecmaVersion: 'latest', sourceType: 'module' },
      plugins: { '@nancyzeng0210/tvu-design-system': tvuPlugin as any },
      rules: {
        '@nancyzeng0210/tvu-design-system/no-inline-svg': 'error',
      },
    },
    { filename: 'test.js' }
  )
}

describe('eslint-plugin / no-inline-svg', () => {
  describe('Vue SFC <template> (META-001 regression)', () => {
    it('flags <svg> in template', () => {
      const code = `<template>
  <svg viewBox="0 0 24 24"><path d="M5 8h11l-2.5-2.5" /></svg>
</template>`
      const msgs = lintVue(code)
      expect(msgs.length).toBeGreaterThanOrEqual(1)
      expect(msgs[0].messageId).toBe('inlineSvg')
    })

    it('flags <svg> as <symbol> sprite in template', () => {
      const code = `<template>
  <svg style="display:none">
    <symbol id="x" viewBox="0 0 24 24"><path d="M5 8" /></symbol>
  </svg>
</template>`
      const msgs = lintVue(code)
      expect(msgs.some((m) => m.messageId === 'inlineSvg')).toBe(true)
    })

    it('flags emoji status marker in template text', () => {
      const code = `<template><span>🔴 down</span></template>`
      const msgs = lintVue(code)
      expect(msgs.some((m) => m.messageId === 'emojiStatus')).toBe(true)
    })

    it('flags unicode arrow in template text', () => {
      const code = `<template><div>a → b</div></template>`
      const msgs = lintVue(code)
      expect(msgs.some((m) => m.messageId === 'unicodeArrow')).toBe(true)
    })

    it('clean template passes', () => {
      const code = `<template><div>Hello world</div></template>`
      const msgs = lintVue(code)
      expect(msgs).toEqual([])
    })
  })

  describe('JS / TS source', () => {
    it('flags <svg in string literal', () => {
      const msgs = lintJs(`const x = '<svg><path d="M5"/></svg>'`)
      expect(msgs.some((m) => m.messageId === 'inlineSvg')).toBe(true)
    })

    it('flags emoji in string literal', () => {
      const msgs = lintJs(`const x = '🔴 alert'`)
      expect(msgs.some((m) => m.messageId === 'emojiStatus')).toBe(true)
    })

    it('flags unicode arrow in template literal', () => {
      const msgs = lintJs('const x = `a → b`')
      expect(msgs.some((m) => m.messageId === 'unicodeArrow')).toBe(true)
    })

    it('clean js passes', () => {
      const msgs = lintJs(`const x = 'hello'`)
      expect(msgs).toEqual([])
    })
  })

  describe('parity with CLI R1', () => {
    // Mirrors the 5 real findings on MicroApps Console vue-app — each was a
    // Vue SFC <template> <svg>. Plugin must catch each.
    const fixtures = [
      `<template>\n  <svg xmlns="http://www.w3.org/2000/svg"><symbol id="x"><path d="M5"/></symbol></svg>\n</template>`,
      `<template>\n  <div><svg viewBox="0 0 24 24"><path d="M12 4v16"/></svg></div>\n</template>`,
      `<template>\n  <button><svg><path d="M5 8h11"/></svg></button>\n</template>`,
    ]
    for (const [i, code] of fixtures.entries()) {
      it(`fixture #${i + 1} flagged`, () => {
        const msgs = lintVue(code)
        expect(msgs.some((m) => m.messageId === 'inlineSvg')).toBe(true)
      })
    }
  })
})