import { candidate, css, html, js, json, test, ts } from '../utils'

test(
  'sveltekit build resolves package plugins',
  {
    fs: {
      'package.json': json`
        {
          "type": "module",
          "scripts": {
            "prepare": "svelte-kit sync || echo ''"
          },
          "dependencies": {
            "svelte": "^5",
            "tailwindcss": "workspace:^"
          },
          "devDependencies": {
            "@sveltejs/adapter-auto": "^6",
            "@sveltejs/kit": "^2",
            "@tailwindcss/forms": "^0.5.11",
            "@tailwindcss/vite": "workspace:^",
            "vite": "^8"
          }
        }
      `,
      'svelte.config.js': js`
        import adapter from '@sveltejs/adapter-auto'

        export default {
          kit: {
            adapter: adapter(),
          },
        }
      `,
      'vite.config.ts': ts`
        import tailwindcss from '@tailwindcss/vite'
        import { sveltekit } from '@sveltejs/kit/vite'
        import { defineConfig } from 'vite'

        export default defineConfig({
          build: { cssMinify: false },
          plugins: [tailwindcss(), sveltekit()],
        })
      `,
      'src/app.html': html`
        <!doctype html>
        <html lang="en">
          <head>
            %sveltekit.head%
          </head>
          <body data-sveltekit-preload-data="hover">
            <div style="display: contents">%sveltekit.body%</div>
          </body>
        </html>
      `,
      'src/routes/+layout.svelte': html`
        <script>
          import '../app.css'
        </script>

        <slot />
      `,
      'src/routes/+page.svelte': html`
        <div class="form-input">Hello, world!</div>
      `,
      'src/app.css': css`
        @import 'tailwindcss';
        @plugin '@tailwindcss/forms';
      `,
    },
  },
  async ({ exec, fs, expect }) => {
    await exec('pnpm vite build')

    let files = await fs.glob('.svelte-kit/output/client/**/*.css')
    expect(files.length).toBeGreaterThan(0)

    await fs.expectFileToContain(files[0][0], [candidate`form-input`])
  },
)