Update Build Process and Set Test Relative URL

ckabalan · Oct 15, 2024 · ca172d6 · ca172d6
1 parent fbc56d9
commit ca172d6
Show file tree

Hide file tree

Showing 13 changed files with 726 additions and 726 deletions.
diff --git a/dist/css/bootstrap.min.css b/dist/css/bootstrap.min.css
diff --git a/dist/css/bootstrap.min.css.map b/dist/css/bootstrap.min.css.map
diff --git a/src/package-lock.json b/src/package-lock.json
diff --git a/src/package.json b/src/package.json
@@ -5,7 +5,7 @@
     "lz-string": "^1.5.0"
   },
   "scripts": {
-    "postinstall": "sudo npm install -g sass",
+    "postinstall": "sudo npm install -g sass@1.77.6 && brew install mkcert",
     "build": "sass --style compressed scss/custom.scss:../dist/css/bootstrap.min.css && cp node_modules/lz-string/libs/lz-string.min.js ../dist/js/lz-string.min.js",
     "test": "npx playwright test",
     "setup:certs": "mkdir -p certs; mkcert -cert-file certs/cert.pem -key-file certs/cert.key localhost 127.0.0.1",

diff --git a/src/playwright.config.ts b/src/playwright.config.ts
@@ -26,8 +26,8 @@ export default defineConfig({
   /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
   use: {
     /* Base URL to use in actions like `await page.goto('/')`. */
-    // baseURL: 'http://127.0.0.1:3000',
-
+    baseURL: 'https://localhost:8443',
+    ignoreHTTPSErrors: true,
     /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
     trace: 'on-first-retry',
   },
@@ -91,9 +91,9 @@ export default defineConfig({
   ],
 
   /* Run your local dev server before starting the tests */
-  // webServer: {
-  //   command: 'npm run start',
-  //   url: 'http://127.0.0.1:3000',
-  //   reuseExistingServer: !process.env.CI,
-  // },
+  webServer: {
+    command: 'npm run build && npm run setup:certs && npm run local-secure-start',
+    port: 8443,
+    reuseExistingServer: !process.env.CI,
+  },
 });
diff --git a/src/tests/deep-functional.spec.ts b/src/tests/deep-functional.spec.ts
@@ -18,7 +18,7 @@ test('Deep Functional Test', async ({ page }) => {
   //   - AWS/Azure Mode
   //   - Import Reddit Example Config
   //   - Change Network Size
-  await page.goto('https://127.0.0.1:8443/');
+  await page.goto('/');
   // Change 10.0.0.0/8 -> 172.16.0.0/12
   await page.getByLabel('Network Address').click();
   await page.getByLabel('Network Address').press('Shift+Home');
@@ -188,5 +188,5 @@ test('Deep Functional Test', async ({ page }) => {
 
 
 //test('Test', async ({ page }) => {
-//  await page.goto('https://127.0.0.1:8443/');
+//  await page.goto('/');
 //});
diff --git a/src/tests/default-homepage.spec.ts b/src/tests/default-homepage.spec.ts
@@ -1,7 +1,7 @@
 import { test, expect } from '@playwright/test';
 
 test('Default Homepage Rendering', async ({ page }) => {
-  await page.goto('https://127.0.0.1:8443/');
+  await page.goto('/');
   await expect(page).toHaveTitle(/Visual Subnet Calculator/);
   await expect(page.getByRole('heading')).toContainText('Visual Subnet Calculator');
   await expect(page.getByLabel('Network Address')).toHaveValue('10.0.0.0');

diff --git a/src/tests/import-export.spec.ts b/src/tests/import-export.spec.ts
@@ -1,7 +1,7 @@
 import { test, expect } from '@playwright/test';
 
 test('Default Export Content', async ({ page }) => {
-  await page.goto('https://127.0.0.1:8443/');
+  await page.goto('/');
   await page.getByRole('button', { name: 'Tools' }).click();
   await page.getByRole('link', { name: 'Import / Export' }).click();
   await expect(page.locator('#importExportModalLabel')).toContainText('Import/Export');
@@ -11,7 +11,7 @@ test('Default Export Content', async ({ page }) => {
 });
 
 test('Default (AWS) Export Content', async ({ page }) => {
-  await page.goto('https://127.0.0.1:8443/');
+  await page.goto('/');
   await page.getByRole('button', { name: 'Tools' }).click();
   await page.getByRole('link', { name: 'Mode - AWS' }).click();
   await page.getByRole('button', { name: 'Tools' }).click();
@@ -20,7 +20,7 @@ test('Default (AWS) Export Content', async ({ page }) => {
 });
 
 test('Default (Azure) Export Content', async ({ page }) => {
-  await page.goto('https://127.0.0.1:8443/');
+  await page.goto('/');
   await page.getByRole('button', { name: 'Tools' }).click();
   await page.getByRole('link', { name: 'Mode - Azure' }).click();
   await page.getByRole('button', { name: 'Tools' }).click();
@@ -30,7 +30,7 @@ test('Default (Azure) Export Content', async ({ page }) => {
 });
 
 test('Import 192.168.0.0/24', async ({ page }) => {
-  await page.goto('https://127.0.0.1:8443/');
+  await page.goto('/');
   await page.getByRole('button', { name: 'Tools' }).click();
   await page.getByRole('link', { name: 'Import / Export' }).click();
   await page.getByLabel('Import/Export Content').click();
@@ -42,6 +42,6 @@ test('Import 192.168.0.0/24', async ({ page }) => {
 });
 
 //test('Test', async ({ page }) => {
-//  await page.goto('https://127.0.0.1:8443/');
+//  await page.goto('/');
 //});
 
diff --git a/src/tests/real-world-functional.spec.ts.gpg b/src/tests/real-world-functional.spec.ts.gpg
diff --git a/src/tests/subnet-basic.spec.ts b/src/tests/subnet-basic.spec.ts
@@ -7,7 +7,7 @@ async function getClipboardText(page) {
 }
 
 test('Renders Max Depth /0 to /32', async ({ page }) => {
-  await page.goto('https://127.0.0.1:8443/');
+  await page.goto('/');
   await page.getByLabel('Network Address').click();
   await page.getByLabel('Network Address').press('Shift+Home');
   await page.getByLabel('Network Address').fill('0.0.0.0');
@@ -56,7 +56,7 @@ test('Renders Max Depth /0 to /32', async ({ page }) => {
 });
 
 test('Change To 192.168.0.0/24', async ({ page }) => {
-  await page.goto('https://127.0.0.1:8443/');
+  await page.goto('/');
   await page.getByLabel('Network Address').click();
   await page.getByLabel('Network Address').fill('192.168.0.0');
   await page.getByLabel('Network Size').click();
@@ -71,7 +71,7 @@ test('Change To 192.168.0.0/24', async ({ page }) => {
 });
 
 test('Deep /32 Split', async ({ page }) => {
-  await page.goto('https://127.0.0.1:8443/');
+  await page.goto('/');
   await page.getByText('/16', { exact: true }).click();
   await page.getByLabel('10.0.128.0/17', { exact: true }).getByText('/17', { exact: true }).click();
   await page.getByLabel('10.0.128.0/18', { exact: true }).getByText('/18', { exact: true }).click();
@@ -105,28 +105,28 @@ test('Deep /32 Split', async ({ page }) => {
 });
 
 test('Usable IPs - Standard', async ({ page }) => {
-  await page.goto('https://127.0.0.1:8443/');
+  await page.goto('/');
   await page.getByRole('button', { name: 'Tools' }).click();
   await page.getByRole('link', { name: 'Mode - Standard' }).click();
   await expect(page.getByLabel('10.0.0.0/16', { exact: true }).getByLabel('Usable IPs')).toContainText('10.0.0.1 - 10.0.255.254');
 });
 
 test('Usable IPs - AWS', async ({ page }) => {
-  await page.goto('https://127.0.0.1:8443/');
+  await page.goto('/');
   await page.getByRole('button', { name: 'Tools' }).click();
   await page.getByRole('link', { name: 'Mode - AWS' }).click();
   await expect(page.getByLabel('10.0.0.0/16', { exact: true }).getByLabel('Usable IPs')).toContainText('10.0.0.4 - 10.0.255.254');
 });
 
 test('Usable IPs - Azure', async ({ page }) => {
-  await page.goto('https://127.0.0.1:8443/');
+  await page.goto('/');
   await page.getByRole('button', { name: 'Tools' }).click();
   await page.getByRole('link', { name: 'Mode - Azure' }).click();
   await expect(page.getByLabel('10.0.0.0/16', { exact: true }).getByLabel('Usable IPs')).toContainText('10.0.0.4 - 10.0.255.254');
 });
 
 test('Note Splitting', async ({ page }) => {
-  await page.goto('https://127.0.0.1:8443/');
+  await page.goto('/');
   await page.getByLabel('Note Split/Join').click();
   await page.getByLabel('Note Split/Join').fill('This should be duplicated!');
   await page.getByRole('cell', { name: '/16 Split' }).click();
@@ -135,19 +135,19 @@ test('Note Splitting', async ({ page }) => {
 });
 
 test('Note Joining Same', async ({ page }) => {
-  await page.goto('https://127.0.0.1:8443/index.html?c=1N4IgbiBcIEwgNCARlEBGADAOm7g9GgGwIgDOUoGA5hSBgBa0B2qAKvQJakAEp9A9gFcANgBNuSAKbdRggA7COAYwCGAF0miAhCAC+iNI0igW0dl14CR4qTPmLVG7Xt2ugA');
+  await page.goto('/index.html?c=1N4IgbiBcIEwgNCARlEBGADAOm7g9GgGwIgDOUoGA5hSBgBa0B2qAKvQJakAEp9A9gFcANgBNuSAKbdRggA7COAYwCGAF0miAhCAC+iNI0igW0dl14CR4qTPmLVG7Xt2ugA');
   await page.getByLabel('/16 Join').click();
   await expect(page.getByLabel('Note Split/Join')).toHaveValue('This should be duplicated!');
 });
 
 test('Note Joining Different', async ({ page }) => {
-  await page.goto('https://127.0.0.1:8443/index.html?c=1N4IgbiBcIEwgNCARlEBGADAOm7g9GgGwIgDOUoGA5hSBgBa0B2qAKvQJakAEp9A9gFcANgBNuSAKbdRggA7COAYwCGAF0miAhNwCCIAL6I0jSKBbR2XXgJHipM+YtUbt3AEKGD3oA');
+  await page.goto('/index.html?c=1N4IgbiBcIEwgNCARlEBGADAOm7g9GgGwIgDOUoGA5hSBgBa0B2qAKvQJakAEp9A9gFcANgBNuSAKbdRggA7COAYwCGAF0miAhNwCCIAL6I0jSKBbR2XXgJHipM+YtUbt3AEKGD3oA');
   await page.getByLabel('/16 Join').click();
   await expect(page.getByLabel('Note Split/Join')).toBeEmpty();
 });
 
 test('Color Splitting', async ({ page }) => {
-  await page.goto('https://127.0.0.1:8443/');
+  await page.goto('/');
   await page.getByText('Change Colors »').click();
   await page.getByLabel('Color 5').click();
   await page.getByRole('cell', { name: '/16 Subnet Address' }).click();
@@ -158,17 +158,17 @@ test('Color Splitting', async ({ page }) => {
 });
 
 test('Color Joining Same', async ({ page }) => {
-  await page.goto('https://127.0.0.1:8443/index.html?c=1N4IgbiBcIEwgNCARlEBGADAOm7g9GgGwIgDOUoGA5hSBgBa0DGqAxAJxIBmhXXIAX0RpGkUC2gduvfgLkCgA');
+  await page.goto('/index.html?c=1N4IgbiBcIEwgNCARlEBGADAOm7g9GgGwIgDOUoGA5hSBgBa0DGqAxAJxIBmhXXIAX0RpGkUC2gduvfgLkCgA');
   await page.getByLabel('/16 Join').click();
   await expect(page.getByRole('row', { name: '10.0.0.0/16' })).toHaveCSS('background-color', 'rgb(155, 246, 255)');
 });
 
 test('Color Joining Different', async ({ page }) => {
-  await page.goto('https://127.0.0.1:8443/index.html?c=1N4IgbiBcIEwgNCARlEBGADAOm7g9GgGwIgDOUoGA5hSBgBa0DGqAxAJxIBmhXXIAX0RpGkUC2isuAEz5JiAxQKA');
+  await page.goto('/index.html?c=1N4IgbiBcIEwgNCARlEBGADAOm7g9GgGwIgDOUoGA5hSBgBa0DGqAxAJxIBmhXXIAX0RpGkUC2isuAEz5JiAxQKA');
   await page.getByLabel('/16 Join').click();
   await expect(page.getByRole('row', { name: '10.0.0.0/16' })).toHaveCSS('background-color', 'rgba(0, 0, 0, 0)');
 });
 
 //test('Test', async ({ page }) => {
-//  await page.goto('https://127.0.0.1:8443/');
+//  await page.goto('/');
 //});
diff --git a/src/tests/ui-error-handling.spec.ts b/src/tests/ui-error-handling.spec.ts
@@ -1,7 +1,7 @@
 import { test, expect } from '@playwright/test';
 
 test('Bad Network Address', async ({ page }) => {
-  await page.goto('https://127.0.0.1:8443/');
+  await page.goto('/');
   await page.getByLabel('Network Address').click();
   await page.getByLabel('Network Address').fill('1');
   await page.locator('html').click();
@@ -10,7 +10,7 @@ test('Bad Network Address', async ({ page }) => {
 });
 
 test('Bad Network Size', async ({ page }) => {
-  await page.goto('https://127.0.0.1:8443/');
+  await page.goto('/');
   await page.getByLabel('Network Size').click();
   await page.getByLabel('Network Size').fill('33');
   await page.locator('html').click();
@@ -19,7 +19,7 @@ test('Bad Network Size', async ({ page }) => {
 });
 
 test('Prevent Go on Bad Input', async ({ page }) => {
-  await page.goto('https://127.0.0.1:8443/');
+  await page.goto('/');
   await page.getByLabel('Network Size').click();
   await page.getByLabel('Network Size').fill('33');
   await page.locator('html').click();
@@ -30,7 +30,7 @@ test('Prevent Go on Bad Input', async ({ page }) => {
 
 
 test('Network Boundary Correction', async ({ page }) => {
-  await page.goto('https://127.0.0.1:8443/');
+  await page.goto('/');
   await page.getByLabel('Network Address').click();
   await page.getByLabel('Network Address').fill('123.45.67.89');
   await page.getByLabel('Network Size').click();
@@ -49,7 +49,7 @@ test('Network Boundary Correction', async ({ page }) => {
 });
 
 test('Subnet Too Small for AWS Mode', async ({ page }) => {
-  await page.goto('https://127.0.0.1:8443/');
+  await page.goto('/');
   await expect(page.locator('#useableHeader')).toContainText('Usable IPs');
   await page.getByRole('button', { name: 'Tools' }).click();
   await page.getByRole('link', { name: 'Mode - AWS' }).click();
@@ -62,7 +62,7 @@ test('Subnet Too Small for AWS Mode', async ({ page }) => {
 });
 
 test('Subnet Too Small for Azure Mode', async ({ page }) => {
-  await page.goto('https://127.0.0.1:8443/');
+  await page.goto('/');
   await expect(page.locator('#useableHeader')).toContainText('Usable IPs');
   await page.getByRole('button', { name: 'Tools' }).click();
   await page.getByRole('link', { name: 'Mode - Azure' }).click();

diff --git a/src/tests/ui-usage.spec.ts b/src/tests/ui-usage.spec.ts
@@ -1,7 +1,7 @@
 import { test, expect } from '@playwright/test';
 
 test('CIDR Input Typing', async ({ page }) => {
-  await page.goto('https://127.0.0.1:8443/');
+  await page.goto('/');
   await page.getByLabel('Network Address').click();
   await page.getByLabel('Network Address').press('End');
   await page.getByLabel('Network Address').press('Shift+Home');
@@ -12,7 +12,7 @@ test('CIDR Input Typing', async ({ page }) => {
 });
 
 test('CIDR Input Paste', async ({ page }) => {
-  await page.goto('https://127.0.0.1:8443/');
+  await page.goto('/');
   await page.getByLabel('Network Address').click();
   await page.getByLabel('Network Address').press('End');
   await page.getByLabel('Network Address').press('Shift+Home');
@@ -35,7 +35,7 @@ test('CIDR Input Paste', async ({ page }) => {
 });
 
 test('About Dialog', async ({ page }) => {
-  await page.goto('https://127.0.0.1:8443/');
+  await page.goto('/');
   await page.locator('#info_icon').click();
   await expect(page.locator('#aboutModalLabel')).toContainText('About Visual Subnet Calculator');
   await expect(page.getByLabel('About Visual Subnet Calculator')).toContainText('Design Tenets');
@@ -44,20 +44,20 @@ test('About Dialog', async ({ page }) => {
 });
 
 test('GitHub Link', async ({ page }) => {
-  await page.goto('https://127.0.0.1:8443/');
+  await page.goto('/');
   const page1Promise = page.waitForEvent('popup');
   await page.getByLabel('GitHub').click();
   const page1 = await page1Promise;
   await expect(page1.locator('#repository-container-header')).toContainText('ckabalan / visualsubnetcalc Public');
 });
 
 test('Table Header Standard Mode', async ({ page }) => {
-  await page.goto('https://127.0.0.1:8443/');
+  await page.goto('/');
   await expect(page.locator('#useableHeader')).toContainText('Usable IPs');
 });
 
 test('Table Header AWS Mode', async ({ page }) => {
-  await page.goto('https://127.0.0.1:8443/');
+  await page.goto('/');
   await expect(page.locator('#useableHeader')).toContainText('Usable IPs');
   await page.getByRole('button', { name: 'Tools' }).click();
   await page.getByRole('link', { name: 'Mode - AWS' }).click();
@@ -67,7 +67,7 @@ test('Table Header AWS Mode', async ({ page }) => {
 });
 
 test('Table Header Azure Mode', async ({ page }) => {
-  await page.goto('https://127.0.0.1:8443/');
+  await page.goto('/');
   await expect(page.locator('#useableHeader')).toContainText('Usable IPs');
   await page.getByRole('button', { name: 'Tools' }).click();
   await page.getByRole('link', { name: 'Mode - Azure' }).click();
@@ -78,7 +78,7 @@ test('Table Header Azure Mode', async ({ page }) => {
 
 
 test('Table Header AWS then Standard', async ({ page }) => {
-  await page.goto('https://127.0.0.1:8443/');
+  await page.goto('/');
   await expect(page.locator('#useableHeader')).toContainText('Usable IPs');
   await page.getByRole('button', { name: 'Tools' }).click();
   await page.getByRole('link', { name: 'Mode - AWS' }).click();
@@ -90,7 +90,7 @@ test('Table Header AWS then Standard', async ({ page }) => {
 });
 
 test('Color Palette', async ({ page }) => {
-  await page.goto('https://127.0.0.1:8443/');
+  await page.goto('/');
   await expect(page.getByLabel('Change Colors').locator('span')).toContainText('Change Colors »');
   await page.getByText('Change Colors »').click();
   await expect(page.getByLabel('Color 1', { exact: true })).toBeVisible();
@@ -109,7 +109,7 @@ test('Color Palette', async ({ page }) => {
 });
 
 test('Test Default Colors', async ({ page }) => {
-  await page.goto('https://127.0.0.1:8443/index.html?c=1N4IgbiBcIEwgNCARlEBGADAOm7g9GgGwIgDOUoGA5hSBgBa0YCWTAVkwNYUC+ia3SMB590HIbEHDEAZikjRaVhJjjQAFnmIArPNEy1IQlpAB2PSP6MVyjYYAcJgJx6dhzCbQDelkDNtG7jCecj6Ipu6avPy6PgoiQA');
+  await page.goto('/index.html?c=1N4IgbiBcIEwgNCARlEBGADAOm7g9GgGwIgDOUoGA5hSBgBa0YCWTAVkwNYUC+ia3SMB590HIbEHDEAZikjRaVhJjjQAFnmIArPNEy1IQlpAB2PSP6MVyjYYAcJgJx6dhzCbQDelkDNtG7jCecj6Ipu6avPy6PgoiQA');
   await page.getByText('Change Colors »').click();
   // Set the top 10 rows to the default colors and check that they are correct
   await page.getByLabel('Color 1', { exact: true }).click();