KanbanGit/tests/Fixtures/welcome.mjs

import assert from 'node:assert/strict';
import process from 'node:process';
import { fileURLToPath } from 'node:url';
import tailwind from '@tailwindcss/vite';
import vue from '@vitejs/plugin-vue';
import { createInertiaApp } from '@inertiajs/vue3';
import { createServer } from 'vite';
import { createSSRApp, h } from 'vue';
import { renderToString } from 'vue/server-renderer';

const serve = process.argv.includes('--serve');
const server = await createServer({
    configFile: false,
    cacheDir: 'node_modules/.vite/welcome-fixture',
    plugins: [vue(), ...(serve ? [tailwind()] : [])],
    resolve: {
        alias: {
            '@': fileURLToPath(new URL('../../resources/js', import.meta.url)),
        },
    },
    server: serve
        ? { host: '127.0.0.1', port: 4192, strictPort: true, hmr: false }
        : { middlewareMode: true, hmr: false, watch: null },
    appType: 'custom',
});

const user = {
    id: 8,
    name: 'Alex Morgan',
    email: 'alex@example.test',
};

function makePage(url) {
    const parsedUrl = new URL(url, 'http://localhost');
    const isWelcome = parsedUrl.pathname === '/';
    const isAuthenticated =
        isWelcome && parsedUrl.searchParams.get('auth') === '1';

    return {
        component: isWelcome ? 'Welcome' : 'Destination',
        url,
        version: null,
        clearHistory: false,
        encryptHistory: false,
        props: {
            name: 'KanbanGit',
            errors: {},
            auth: {
                user: isAuthenticated ? user : null,
            },
        },
    };
}

if (serve) {
    server.middlewares.use(async (request, response) => {
        const page = makePage(request.url);
        response.setHeader('Vary', 'X-Inertia');
        if (request.headers['x-inertia']) {
            response.setHeader('X-Inertia', 'true');
            response.setHeader('Content-Type', 'application/json');
            response.end(JSON.stringify(page));
            return;
        }

        const escaped = JSON.stringify(page)
            .replaceAll('&', '&')
            .replaceAll('"', '"')
            .replaceAll('<', '&lt;');
        response.setHeader('Content-Type', 'text/html');
        response.end(
            await server.transformIndexHtml(
                request.url,
                '<!doctype html><html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1"></head><body><div id="app" data-page="' +
                    escaped +
                    '"></div><script type="module" src="/tests/Fixtures/welcome-preview.mjs"></script></body></html>',
            ),
        );
    });
    await server.listen();
    console.log('Welcome fixture ready at http://127.0.0.1:4192/');
} else {
    try {
        const { createAppearance } = await server.ssrLoadModule(
            '/resources/js/composables/useAppearance.ts',
        );
        const { createLocalization } = await server.ssrLoadModule(
            '/resources/js/lib/localization.ts',
        );
        const { en } = await server.ssrLoadModule(
            '/resources/js/locales/en.ts',
        );
        const { default: Welcome } = await server.ssrLoadModule(
            '/resources/js/pages/Welcome.vue',
        );

        const render = async (url, localization = createLocalization()) => {
            const response = await createInertiaApp({
                page: makePage(url),
                resolve: () => Welcome,
                render: renderToString,
                setup: ({ App, props, plugin }) =>
                    createSSRApp({ render: () => h(App, props) })
                        .use(plugin)
                        .use(localization)
                        .use(createAppearance('light')),
            });
            return response.body;
        };

        const guest = await render('/');
        assert.match(guest, /Plan the work\. Keep Git context close\./);
        assert.match(guest, /Configurable workflows/);
        assert.match(guest, /Structured ticket context/);
        assert.match(guest, /Repository-aware delivery/);
        assert.equal((guest.match(/href="\/login"/g) ?? []).length, 2);
        assert.doesNotMatch(guest, /href="\/dashboard"/);
        assert.doesNotMatch(guest, /Laravel|Laracasts|Deploy now/);

        const authenticated = await render('/?auth=1');
        assert.equal(
            (authenticated.match(/href="\/dashboard"/g) ?? []).length,
            2,
        );
        assert.doesNotMatch(authenticated, /href="\/login"/);

        const german = {
            ...en,
            'welcome.title': 'Arbeit planen. Git-Kontext behalten.',
            'welcome.action.signIn': 'Bei KanbanGit anmelden',
        };
        const localized = await render(
            '/',
            createLocalization({ locale: 'de' }, { de: german }),
        );
        assert.match(localized, /Arbeit planen\. Git-Kontext behalten\./);
        assert.match(localized, /Bei KanbanGit anmelden/);
        assert.doesNotMatch(
            localized,
            /Plan the work\. Keep Git context close\./,
        );

        console.log('Welcome behavior checks passed.');
    } finally {
        await server.close();
    }
}