Refactor code structure for improved readability and maintainability

Author: spences10

packages/sveltekit-embed/package.json

@@ -78,15 +78,15 @@
 		"svelte": "^4.0.0 || ^5.0.0"
 	},
 	"devDependencies": {
-		"@eslint/compat": "^1.2.9",
+		"@eslint/compat": "^2.0.0",
 		"@eslint/js": "^9.27.0",
 		"@playwright/test": "^1.52.0",
-		"@sveltejs/adapter-auto": "^6.0.1",
-		"@sveltejs/kit": "^2.21.1",
+		"@sveltejs/adapter-auto": "^7.0.0",
+		"@sveltejs/kit": "^2.49.1",
 		"@sveltejs/package": "^2.3.11",
-		"@sveltejs/vite-plugin-svelte": "^5.0.3",
-		"@vitest/browser": "^3.1.4",
-		"@vitest/coverage-v8": "3.1.4",
+		"@sveltejs/vite-plugin-svelte": "^6.2.1",
+		"@vitest/browser": "^4.0.15",
+		"@vitest/coverage-v8": "4.0.15",
 		"eslint": "^9.27.0",
 		"eslint-config-prettier": "^10.1.5",
 		"eslint-plugin-svelte": "^3.9.0",
@@ -102,9 +102,9 @@
 		"svelte-check": "^4.2.1",
 		"typescript": "^5.8.3",
 		"typescript-eslint": "^8.32.1",
-		"vite": "^6.3.5",
-		"vitest": "^3.1.4",
-		"vitest-browser-svelte": "^0.1.0"
+		"vite": "^7.2.6",
+		"vitest": "^4.0.15",
+		"vitest-browser-svelte": "^2.0.1"
 	},
 	"svelte": "./dist/index.js",
 	"types": "./dist/index.d.ts",

packages/sveltekit-embed/src/lib/components/deezer.svelte.test.ts

@@ -69,25 +69,25 @@ describe('Deezer', () => {
 
 		it('should handle special characters in frameSrc', async () => {
 			const specialFrameSrc = 'track/123-test_track';
-			const { getByTitle } = render(Deezer, {
+			render(Deezer, {
 				theme,
 				frameSrc: specialFrameSrc,
 				disable_observer: true,
 			});
-			const iframe = getByTitle('deezer-widget');
+			const iframe = page.getByTitle('deezer-widget');
 			const element = iframe.element() as HTMLIFrameElement;
 
 			expect(element.src).toContain(specialFrameSrc);
 		});
 
 		it('should handle very long frameSrc values', async () => {
 			const longFrameSrc = 'track/' + 'a'.repeat(1000);
-			const { getByTitle } = render(Deezer, {
+			render(Deezer, {
 				theme,
 				frameSrc: longFrameSrc,
 				disable_observer: true,
 			});
-			const iframe = getByTitle('deezer-widget');
+			const iframe = page.getByTitle('deezer-widget');
 			const element = iframe.element() as HTMLIFrameElement;
 
 			expect(element.src).toContain(longFrameSrc);
@@ -96,23 +96,23 @@ describe('Deezer', () => {
 
 	describe('Default Props', () => {
 		it('should apply default theme when not provided', async () => {
-			const { getByTitle } = render(Deezer, {
+			render(Deezer, {
 				frameSrc,
 				disable_observer: true,
 			});
-			const iframe = getByTitle('deezer-widget');
+			const iframe = page.getByTitle('deezer-widget');
 			const element = iframe.element() as HTMLIFrameElement;
 
 			expect(element.src).toContain('widget/auto/');
 		});
 
 		it('should apply default border-radius styling', async () => {
-			const { getByTitle } = render(Deezer, {
+			render(Deezer, {
 				theme,
 				frameSrc,
 				disable_observer: true,
 			});
-			const iframe = getByTitle('deezer-widget');
+			const iframe = page.getByTitle('deezer-widget');
 			const element = iframe.element() as HTMLIFrameElement;
 
 			expect(element.style.borderRadius).toBe('0.6rem');

packages/sveltekit-embed/vite.config.ts

@@ -1,19 +1,20 @@
 import { sveltekit } from '@sveltejs/kit/vite';
+import { playwright } from '@vitest/browser/playwright';
 import { defineConfig } from 'vite';
 import { coverageConfigDefaults } from 'vitest/config';
 
 export default defineConfig({
 	plugins: [sveltekit()],
 	test: {
-		workspace: [
+		projects: [
 			{
 				extends: './vite.config.ts',
 				test: {
 					name: 'client',
 					environment: 'browser',
 					browser: {
 						enabled: true,
-						provider: 'playwright',
+						provider: playwright(),
 						instances: [
 							{
 								browser: 'chromium',
@@ -37,7 +38,7 @@ export default defineConfig({
 			},
 		],
 		coverage: {
-			all: true,
+			include: ['src/**/*.{ts,svelte}'],
 			reporter: ['text-summary', 'html'],
 			exclude: [
 				...coverageConfigDefaults.exclude,