big update : moved to typescript and modulariaztion, added some tests…

… (not all work) rergessions : menus, UI..

e2e/localstorage.spec.js

@@ -0,0 +1,22 @@
+import { test, expect } from '@playwright/test';
+
+test('Simulate localStorage entry in PWA', async ({ page }) => {
+  await page.evaluate(() => {
+    localStorage.setItem('audioCache', JSON.stringify({
+      'https://example.com/audio': {
+        audioUrl: 'https://example.com/audio.mp3',
+        transcription: 'Test transcription',
+        lastPosition: 0
+      }
+    }));
+  });
+
+  await page.goto('http://localhost:5173/listen-UI/');
+
+  const audioCache = await page.evaluate(() => localStorage.getItem('audioCache'));
+  expect(audioCache).toBeTruthy();
+
+  const historyList = await page.locator('#historyList');
+  const historyItems = await historyList.locator('li').count();
+  expect(historyItems).toBe(1);
+});

e2e/share-target.spec.js

@@ -1,4 +1,4 @@
-const { test, expect } = require('@playwright/test');
+import { test, expect } from '@playwright/test';
 
 // Add a helper function to check if the server is up
 async function isServerUp(page) {
@@ -45,4 +45,45 @@ test('share-target redirects to index.html when no URL is shared', async ({ page
 
   // Check if we've been redirected to the index.html page
   expect(page.url()).toContain(`index.html`);
+});
+
+test('Share target functionality', async ({ page }) => {
+  console.log('Starting Share target functionality test');
+
+  try {
+    // Simulate sharing a URL to the PWA
+    await page.goto('http://localhost:5173/listen-UI/share-target?url=https://example.com/shared');
+    console.log('Navigated to share target URL');
+
+    // Wait for the page to load and process the shared URL
+    await page.waitForLoadState('networkidle');
+    console.log('Page loaded');
+
+    // Check if the shared URL is processed : we cant test that at the moment as processing takes a lot of time
+    // const sharedUrlProcessed = await page.evaluate(() => {
+    //   const lastProcessedUrl = localStorage.getItem('lastProcessedUrl');
+    //   console.log('Last processed URL:', lastProcessedUrl);
+    //   return lastProcessedUrl === 'https://example.com/shared';
+    // });
+    // expect(sharedUrlProcessed).toBe(true);
+    // console.log('Shared URL processed correctly');
+
+    // Check if the audio player is visible
+    const audioPlayer = await page.locator('#player');
+    await expect(audioPlayer).toBeVisible({ timeout: 10000 });
+    console.log('Audio player is visible');
+
+    // Additional checks to ensure the page has loaded correctly
+    const pageTitle = await page.title();
+    expect(pageTitle).not.toBe('');
+    console.log('Page title:', pageTitle);
+
+    const bodyContent = await page.textContent('body');
+    expect(bodyContent).not.toBe('');
+    console.log('Body content length:', bodyContent.length);
+
+  } catch (error) {
+    console.error('Test failed with error:', error);
+    throw error;
+  }
 });