Merge branch 'main' of github.com:CyborgTests/cyborg-test into feature/pip

Author: soloviovmax-ke

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "@cyborgtests/test",
-  "version": "0.0.5",
+  "version": "0.0.6",
   "description": "Powerfull extension for Playwright, that allows you to include manual verification steps in your automated test flow",
   "main": "dist/index.umd.js",
   "module": "dist/index.es.js",
@@ -52,5 +52,8 @@
     "package.json",
     "package-lock.json",
     "src"
-  ]
+  ],
+  "dependencies": {
+    "os": "^0.1.2"
+  }
 }

package.json

@@ -7,6 +7,7 @@ import {
 import { chromium } from "playwright";
 import { config } from "./config";
 import { startServer } from "./utils/server";
+import openInDefaultBrowser from "./utils/openInDefaultBrowser";
 
 class TestFailedError extends Error {
   constructor(message: string) {
@@ -35,6 +36,14 @@ const test = pwTest.extend<{
     });
 
     await tcPage.goto(`http://localhost:${config.uiPort}`);
+
+    await tcPage.exposeFunction('openInMainBrowser', (link: string) => {
+      openInDefaultBrowser(link);
+    });
+    await tcPage.evaluate(() => {
+      (window as any).testUtils.openInMainBrowser = (window as any).openInMainBrowser;
+    });
+
     await tcPage.bringToFront();
 
     await use({

src/test.ts

@@ -8,22 +8,24 @@ export default function Footer() {
 
   return (
     <footer className="footer">
-      <a 
-        href="https://github.com/CyborgTests/cyborg-test" 
-        target="_blank" 
-        rel="noopener noreferrer nofollow"
-        onClick={() => trackButtonClick('github')}
+      <button
+        className="footer-link"
+        onClick={() => {
+          trackButtonClick('github');
+          (window as any).openInMainBrowser('https://github.com/CyborgTests/cyborg-test');
+        }}
       >
         Github
-      </a>
-      <a 
-        href="https://cyborgtests.com" 
-        target="_blank" 
-        rel="noopener noreferrer nofollow"
-        onClick={() => trackButtonClick('discord')}
+      </button>
+      <button
+        className="footer-link"
+        onClick={() => {
+          trackButtonClick('discord');
+          (window as any).openInMainBrowser('https://discord.com/invite/rNZCd3MHDx');
+        }}
       >
         Discord
-      </a>
+      </button>
     </footer>
   );
 } 

src/ui/components/Footer.tsx

@@ -12,13 +12,15 @@ body {
   justify-content: center;
   flex-wrap: wrap;
 }
-.footer a {
+.footer-link {
   color: #7f8c8d;
-  margin: 0 10px;
   text-decoration: none;
   font-size: 12px;
+  width: unset;
+  background-color: transparent;
+  font-weight: 400;
 }
-.footer a:hover {
+.footer-link:hover {
   color: #3498db;
 }
 .header {

src/ui/styles/general.css

@@ -0,0 +1,16 @@
+function openInDefaultBrowser(url: string) {
+  const { exec } = require('child_process');
+  const os = require('os');
+
+  const currentPlatform = os.platform();
+  const commands = {
+    darwin: `open "${url}"`,
+    win32: `start "" "${url}"`,
+    linux: `xdg-open "${url}"`,
+  };
+
+  const command = commands[currentPlatform as keyof typeof commands];
+  if (command) exec(command);
+}
+
+export default openInDefaultBrowser;