test(mirage): correct server authority string in preview builds

[andrewazores]

Welcome to Cryostat! 👋

Before contributing, make sure you have:

• [x] Read the contributing guidelines
• [x] Linked a relevant issue which this PR resolves
• [x] Linked any other relevant issues, PR's, or documentation, if any
• [x] Resolved all conflicts, if any
• [x] Rebased your branch PR on top of the latest upstream main branch
• [x] Attached at least one of the following labels to the PR: [chore, ci, docs, feat, fix, test]
• [x] Signed all commits using a GPG signature

To recreate commits with GPG signature git fetch upstream && git rebase --force --gpg-sign upstream/main

---

Fixes: #1271

How to manually test:

1. Check out PR
2. yarn start:dev:preview should bring up the preview/demo UI. There should be a Fake Target, with a Demo template. Topology view should work, dashboard should work, recording start/stop/archive/delete should work, expanding recording for automated analysis should work. GraphQL-powered things will not work, snapshot recording creation does not work.
3. yarn run build:preview:notests && cd dist && python3 -m http.server, then open http://localhost:8000 in a browser. The preview should work just the same as in the step above.

[tthvo]

Would this patch help? The mock code just needs to get the same wsUrl as in the application code.

diff --git a/src/mirage/index.ts b/src/mirage/index.ts
index 61f75db..abea4bf 100644
--- a/src/mirage/index.ts
+++ b/src/mirage/index.ts
@@ -20,11 +20,12 @@ import { Server as WSServer, Client } from 'mock-socket';
 import factories from './factories';
 import models from './models';
 import { Resource } from './typings';
-import { sizeUnits } from 'src/app/utils/utils';

 export const startMirage = ({ environment = 'development' } = {}) => {
-  const wsUrl = `ws://localhost:9091/api/notifications`;
-  const wsServer = new WSServer(wsUrl);
+  const wsUrl = new URL(window.location.href);
+  wsUrl.protocol = wsUrl.protocol.replace('http', 'ws');
+  wsUrl.pathname = '/api/notifications';
+  const wsServer = new WSServer(wsUrl.toString());

   // Create a mock server socket to send notifications
   let websocket: Client;

I tested with and it seemed OK :D

yarn build:preview:notests
cd dist && npx browser-sync start --server

[andrewazores]

Nice, that seems to work. I did the same build-and-local-webserver trick, except instead of npx browser-sync I used python3 -m http.server - same idea.

Want to commit that patch to this branch so you get credited for the contribution? :)

[tthvo]

Haha nicee, sure :D I don't have access to your fork though so I opened: https://github.com/andrewazores/cryostat-web/pull/2

[andrewazores]

Ah right, that would be a maintainer privilege that I can add commits to peoples' PRs like that...