LIST

svelte vitest repository integration test

inspiration: db test with in-memory postgres https://github.com/drizzle-team/drizzle-orm/issues/4205 separate tests https://github.com/vitest-dev/vitest/discussions/4675 https://vitest.dev/guide/workspace.html (https://svelte.dev/docs/svelte/testing) (https://vitest.dev/api/vi.html#vi-mock) //vitest.workspace.ts import { defineWorkspace } from 'vitest/config' import tsconfigPaths from "vite-tsconfig-paths" import { sveltekit } from '@sveltejs/kit/vite'; export default defineWorkspace([ { test: { name: 'unit', include: ['**/*.spec.ts'], exclude: [ '**/*architecture.spec.ts', '**/*.spec.svelte.ts', '**/**.db.spec.ts' ], }, }, { plugins: [sveltekit()], test: { name: 'svelte unit', include: ['**/*.spec.svelte.ts'], }, }, { test: { name: 'architecture', include: ['**/architecture.spec.ts'], // More integration test related setup here....

March 24, 2025

share scss variables to css variables (svelte + smui material)

theme/_smui-theme.scss @use 'sass:color'; @use '@material/theme/color-palette'; // Svelte Colors! @use '@material/theme/index' as theme with ( $primary: color-palette.$purple-500, $secondary: color-palette.$teal-200, $surface: rgba(0,0,0, 0.08), // 8% darker than the one below $background: #FFFFFF, $error: #B00020, $on-primary: #FFFFFF, $on-secondary: #000000, $on-surface: #000000, $on-error: #FFFFFF, ); :root { // https://github.com/hperrin/svelte-material-ui/blob/master/THEMING.md#theming-the-bare-css --mdc-theme-primary: #{theme.$primary}; --mdc-theme-secondary: #{theme.$secondary}; --mdc-theme-background: #{theme.$background}; --mdc-theme-surface: #{theme.$surface}; --mdc-theme-error: #{theme.$error}; --mdc-theme-on-primary: #{theme.$on-primary}; --mdc-theme-on-secondary: #{theme.$on-secondary}; --mdc-theme-on-surface: #{theme.$on-surface}; --mdc-theme-on-error: #{theme.$on-error}; } dark/_smui-theme.scss @use 'sass:color'; @use '@material/theme/color-palette'; // Svelte Colors!...

March 16, 2025

authjs svelte cloudflare-workers login works locally but not on prod

Problem: npm run dev (aka vite dev) login works as expected npm run build && npm run preview login is broken/weird production deploy login is weird expected: scenario: login on homepage GIVEN not logged in WHEN visit homepage WHEN do login WHEN refresh page (a bug, which requires to refresh) THEN avatar img and sign-out link are visible scenario: logout on homepage GIVEN logged in WHEN visit homepage WHEN do logout WHEN refresh page (a bug, which requires to refresh) THEN sign-in link is visible...

February 17, 2025

password hashing on cloudflare pages

Svelte -> Lucia -> argon2 Lucia is a reference for session-based web app auth. It contains example code snippets and projects for implementing session-based auth within SvelteKit and other JS projects. You can add code which follows the Lucia guide to your project with npx sv create when creating a new project or npx sv add lucia for an existing project. src: svelte recommends using Lucia npx sv add lucia uses import { hash, verify } from '@node-rs/argon2'; and example code from Lucia also uses the same library...

December 14, 2024

PetProject: Explore cloudflare and svelte-kit

Explore cloudflare and svelte-kit

November 1, 2024