chore(deps): bump js-yaml from 3.14.1 to 3.14.2

Bumps [js-yaml](https://github.com/nodeca/js-yaml) from 3.14.1 to 3.14.2.
- [Changelog](https://github.com/nodeca/js-yaml/blob/master/CHANGELOG.md)
- [Commits](https://github.com/nodeca/js-yaml/compare/3.14.1...3.14.2)

---
updated-dependencies:
- dependency-name: js-yaml
  dependency-version: 3.14.2
  dependency-type: indirect
...

Signed-off-by: dependabot[bot] <support@github.com>

cypress/integration/sasjs.tests.ts

@@ -14,23 +14,15 @@ context('sasjs-tests', function () {
 
   function loginIfNeeded() {
     cy.get('body').then(($body) => {
-      if ($body.find('login-form').length > 0) {
+      if ($body.find('input[placeholder="User Name"]').length > 0) {
-        cy.get('login-form')
+        cy.get('input[placeholder="User Name"]')
-          .shadow()
-          .find('#username')
           .should('be.visible')
           .type(username)
-        cy.get('login-form')
+        cy.get('input[placeholder="Password"]')
-          .shadow()
-          .find('#password')
           .should('be.visible')
           .type(password)
-        cy.get('login-form')
+        cy.get('.submit-button').should('be.visible').click()
-          .shadow()
+        cy.get('input[placeholder="User Name"]').should('not.exist') // Wait for login to finish
-          .find('#submit-btn')
-          .should('be.visible')
-          .click()
-        cy.get('login-form').should('not.exist') // Wait for login to finish
       }
     })
   }
@@ -38,36 +30,30 @@ context('sasjs-tests', function () {
   it('Should have all tests successful', () => {
     loginIfNeeded()
 
-    cy.get('tests-view').shadow().find('#run-btn').should('be.visible').click()
+    cy.get('.ui.massive.icon.primary.left.labeled.button')
+      .should('be.visible')
+      .click()
 
-    cy.get('tests-view')
+    cy.get('.ui.massive.loading.primary.button', {
-      .shadow()
+      timeout: testingFinishTimeout
-      .find('#run-btn:disabled', {
+    }).should('not.exist')
-        timeout: testingFinishTimeout
-      })
-      .should('not.exist')
 
-    cy.get('test-card').shadow().find('.status-icon.failed').should('not.exist')
+    cy.get('span.icon.failed').should('not.exist')
   })
 
   it('Should have all tests successful with debug on', () => {
     loginIfNeeded()
 
-    cy.get('tests-view')
+    cy.get('.ui.fitted.toggle.checkbox label').should('be.visible').click()
-      .shadow()
+
-      .find('#debug-toggle')
+    cy.get('.ui.massive.icon.primary.left.labeled.button')
       .should('be.visible')
       .click()
 
-    cy.get('tests-view').shadow().find('#run-btn').should('be.visible').click()
+    cy.get('.ui.massive.loading.primary.button', {
+      timeout: testingFinishTimeout
+    }).should('not.exist')
 
-    cy.get('tests-view')
+    cy.get('span.icon.failed').should('not.exist')
-      .shadow()
-      .find('#run-btn:disabled', {
-        timeout: testingFinishTimeout
-      })
-      .should('not.exist')
-
-    cy.get('test-card').shadow().find('.status-icon.failed').should('not.exist')
   })
 })

package-lock.json

@@ -8107,7 +8107,9 @@
       "license": "MIT"
     },
     "node_modules/js-yaml": {
-      "version": "3.14.1",
+      "version": "3.14.2",
+      "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.14.2.tgz",
+      "integrity": "sha512-PMSmkqxr106Xa156c2M265Z+FTrPl+oxd/rgOQy2tijQeK5TxQ43psO1ZCwhVOSdnn+RzkzlRz/eY4BgJBYVpg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {

sasjs-tests/.env

@@ -0,0 +1,3 @@
+SKIP_PREFLIGHT_CHECK=true
+# Removes index.html inline scripts
+INLINE_RUNTIME_CHUNK=false

sasjs-tests/.gitignore

@@ -1,29 +1,23 @@
-# Logs
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
-logs
+
-*.log
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+
+# testing
+/coverage
+
+# production
+/build
+
+# misc
+.DS_Store
+.env.*
+
 npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
-pnpm-debug.log*
-lerna-debug.log*
 
-node_modules
-dist
-dist-ssr
-*.local
-
-# Editor directories and files
-.vscode/*
-!.vscode/extensions.json
-.idea
-.DS_Store
-*.suo
-*.ntvs*
-*.njsproj
-*.sln
-*.sw?
-
-
-# sasjs
 sasjsbuild
 sasjsresults

sasjs-tests/.prettierrc

@@ -0,0 +1,6 @@
+{
+  "trailingComma": "none",
+  "tabWidth": 2,
+  "semi": false,
+  "singleQuote": true
+}

sasjs-tests/README.md

@@ -1,8 +1,6 @@
-# SASjs Tests
-
 `sasjs-tests` is a test suite for the SASjs adapter.
 
-Browser-based integration testing for [@sasjs/adapter](https://github.com/sasjs/adapter) using TypeScript, Custom Elements, and zero dependencies.
+It is a React app bootstrapped using [Create React App](https://github.com/facebook/create-react-app) and [@sasjs/test-framework](https://github.com/sasjs/test-framework).
 
 When developing on `@sasjs/adapter`, it's good practice to run the test suite against your changed version of the adapter to ensure that existing functionality has not been impacted.
 
@@ -22,70 +20,11 @@ There are three prerequisites to be able to run the tests:
 2. `sasjs-tests` deployed to your SAS server.
 3. The required SAS services created on the same server.
 
-### Configuring the SASjs adapter
+### 1. Configuring the SASjs adapter
 
 There is a `config.json` file in the `/public` folder which specifies the configuration for the SASjs adapter. You can set the values within the `sasjsConfig` property in this file to match your SAS server configuration.
 
-## Test Suites
+### 2. Deploying to your SAS server
-
-Tests are defined in `src/testSuites/`:
-
-- **Basic.ts** - Login, config, session management, debug mode
-- **RequestData.ts** - Data serialization (sendArr, sendObj) with various types
-- **FileUpload.ts** - File upload functionality (VIYA only)
-- **Compute.ts** - Compute API, JES API, executeScript (VIYA only)
-- **SasjsRequests.ts** - WORK tables, log capture
-- **SpecialCases.ts** - Edge cases (currently disabled)
-
-Each test suite follows this pattern:
-
-```typescript
-export const myTests = (adapter: SASjs): TestSuite => ({
-  name: 'My Test Suite',
-  tests: [
-    {
-      title: 'Should do something',
-      description: 'Description of what this tests',
-      test: async () => {
-        // Test logic - return a value
-        return adapter.request('service', data)
-      },
-      assertion: (response) => {
-        // Assertion - return true/false
-        return response.success === true
-      }
-    }
-  ],
-  beforeAll: async () => {
-    // Optional: runs once before all tests
-  },
-  afterAll: async () => {
-    // Optional: runs once after all tests
-  }
-})
-```
-
-### Shadow DOM Access
-
-Cypress accesses Shadow DOM using a custom command:
-
-```javascript
-cy.get('login-form').shadow().find('input#username').type('user')
-```
-
-The `shadow()` command is defined in `cypress/support/commands.js`.
-
-## Deployment
-
-### Build for Production
-
-```bash
-npm run build
-```
-
-This creates a `dist/` folder ready for deployment.
-
-### Deploy to SAS Server
 
 There is a `deploy` NPM script provided in the `sasjs-tests` project's `package.json`.
 
@@ -103,26 +42,21 @@ SSH_ACCOUNT=me@my-sas-server.com DEPLOY_PATH=/var/www/html/my-folder/sasjs-tests
 ```
 
 If you are on `WINDOWS`, you will first need to install one dependency:
-
 ```bash
 npm i -g copyfiles
 ```
-
 and then run to build:
-
 ```bash
 npm run update:adapter && npm run build
 ```
-
 when it finishes run to deploy:
-
 ```bash
 scp -rp ./build/* me@my-sas-server.com:/var/www/html/my-folder/sasjs-tests
 ```
 
 If you'd like to deploy just `sasjs-tests` without changing the adapter version, you can use the `deploy:tests` script, while also setting the same environment variables as above.
 
-#### Creating the required SAS services
+## 3. Creating the required SAS services
 
 The below services need to be created on your SAS server, at the location specified as the `appLoc` in the SASjs configuration.
 
@@ -141,8 +75,8 @@ parmcards4;
     %let table=%scan(&sasjs_tables,&i);
     %webout(OBJ,&table,missing=STRING,showmeta=YES)
   %end;
-  %else %do i=1 %to &_webin_file_count;
+  %else %do i=1 %to &_webin_file_count; 
-    %webout(OBJ,&&_webin_name&i,missing=STRING,showmeta=YES)
+    %webout(OBJ,&&_webin_name&i,missing=STRING,showmeta=YES) 
   %end;
   %mend; %x()
   %webout(CLOSE)
@@ -156,8 +90,8 @@ parmcards4;
     %let table=%scan(&sasjs_tables,&i);
     %webout(ARR,&table,missing=STRING,showmeta=YES)
   %end;
-  %else %do i=1 %to &_webin_file_count;
+  %else %do i=1 %to &_webin_file_count; 
-    %webout(ARR,&&_webin_name&i,missing=STRING,showmeta=YES)
+    %webout(ARR,&&_webin_name&i,missing=STRING,showmeta=YES) 
   %end;
   %mend; %x()
   %webout(CLOSE)
@@ -168,7 +102,7 @@ parmcards4;
     set sashelp.vmacro;
   run;
   %webout(OPEN)
-  %webout(OBJ,macvars)
+  %webout(OBJ,macvars) 
   %webout(CLOSE)
 ;;;;
 %mx_createwebservice(path=&apploc/services/common,name=sendMacVars)
@@ -192,64 +126,23 @@ data _null_;
 
 You should now be able to access the tests in your browser at the deployed path on your server.
 
-#### Using SASjs CLI
+## Creating new tests
 
-```bash
+The `src/testSuites` folder contains all the test suites currently available.
-sasjs deploy -t <target>
+Each suite contains a set of specs, each of which looks like this:
+
+```javascript
+    {
+        title: "Your test title",
+        description: "A slightly more detailed description",
+        test: async () => {
+        // typically makes a request using the adapter and returns a promise
+        },
+        assertion: (response: any) =>
+        // receives the response when the test promise resolves, runs an assertion and returns a boolean
+    }
 ```
 
-### Matrix Notifications
+A test suite is an array of such objects, along with a `name` property.
 
-The `sasjs-cypress-run.sh` script sends Matrix chat notifications on test failure:
+You can add your test to one of the existing suites if suitable, or create a new file that specifies a new test suite.
-
-```bash
-./sasjs-cypress-run.sh $MATRIX_ACCESS_TOKEN $PR_NUMBER
-```
-
-Notification format:
-
-```
-Automated sasjs-tests failed on the @sasjs/adapter PR: <PR_NUMBER>
-```
-
-## SAS Service Setup
-
-The tests require SAS services to be deployed at the `appLoc` specified in `config.json`.
-
-Services expected:
-
-- `common/sendArr` - Echo back array data
-- `common/sendObj` - Echo back object data
-- (Additional services per test suite)
-
-Deploy these services using [SASjs CLI](https://cli.sasjs.io) or manually.
-
-## UI Components (Custom Elements)
-
-- `<login-form>` - SAS authentication
-- `<tests-view>` - Test orchestrator with run controls
-- `<test-suite>` - Test suite display with stats
-- `<test-card>` - Individual test with status (pending/running/passed/failed)
-
-All components use Shadow DOM for style encapsulation and expose custom events for interactivity.
-
-### Adding New Test Suites
-
-1. Create file in `src/testSuites/MyNewTests.ts`
-2. Export function returning TestSuite
-3. Import in `src/index.ts`
-4. Add to `testSuites` array in `showTests()` function
-
-### Modifying UI Components
-
-Components are in `src/components/`:
-
-- Edit `.ts` file
-- Styles are in corresponding `.css` file
-- Rebuild with `npm run build`
-
-## Links
-
-- [@sasjs/adapter](https://adapter.sasjs.io)
-- [SASjs Documentation](https://sasjs.io)
-- [SASjs CLI](https://cli.sasjs.io)

sasjs-tests/craco.config.js

@@ -0,0 +1,15 @@
+// craco.config.js
+// We use craco instead of react-scripts so we can override webpack config, to include source maps
+// so we can debug @sasjs/adapter easier when tests fail
+module.exports = {
+  webpack: {
+    configure: (webpackConfig, { env }) => {
+      // Disable optimizations in both development and production
+      webpackConfig.optimization.minimize = false;
+      webpackConfig.optimization.minimizer = [];
+      webpackConfig.optimization.concatenateModules = false;
+      webpackConfig.optimization.splitChunks = { cacheGroups: { default: false } };
+      return webpackConfig;
+    }
+  }
+};

sasjs-tests/index.css

@@ -1,39 +0,0 @@
-* {
-  box-sizing: border-box;
-  margin: 0;
-  padding: 0;
-}
-
-body {
-  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen,
-    Ubuntu, Cantarell, sans-serif;
-  line-height: 1.6;
-  color: #333;
-  background: #f5f5f5;
-}
-
-.app__error {
-  max-width: 800px;
-  margin: 50px auto;
-  padding: 30px;
-  background: white;
-  border-radius: 8px;
-  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
-
-  h1 {
-    color: #e74c3c;
-    margin-bottom: 15px;
-  }
-
-  p {
-    margin-bottom: 15px;
-  }
-
-  pre {
-    background: #2c3e50;
-    color: #ecf0f1;
-    padding: 15px;
-    border-radius: 4px;
-    overflow-x: auto;
-  }
-}

sasjs-tests/index.html

@@ -1,14 +0,0 @@
-<!doctype html>
-<html lang="en">
-  <head>
-    <meta charset="UTF-8" />
-    <link rel="icon" type="image/png" href="./src/images/favicon.png" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>SASjs tests</title>
-    <link rel="stylesheet" href="./index.css">
-  </head>
-  <body>
-    <div id="app"></div>
-    <script type="module" src="./src/main.ts"></script>
-  </body>
-</html>

sasjs-tests/package.json

@@ -1,25 +1,50 @@
 {
-  "name": "sasjs-tests-new",
+  "name": "@sasjs/tests",
+  "version": "1.0.0",
+  "homepage": ".",
   "private": true,
-  "version": "0.0.0",
+  "dependencies": {
-  "type": "module",
+    "@sasjs/adapter": "file:../build/sasjs-adapter-5.0.0.tgz",
+    "@sasjs/test-framework": "1.5.7",
+    "@types/jest": "^26.0.20",
+    "@types/node": "^14.14.41",
+    "@types/react": "^16.0.1",
+    "@types/react-dom": "^16.0.0",
+    "@types/react-router-dom": "^5.1.7",
+    "react": "^16.0.1",
+    "react-dom": "^16.0.1",
+    "react-router-dom": "^5.2.0",
+    "react-scripts": "4.0.3",
+    "typescript": "^4.1.3"
+  },
   "scripts": {
-    "start": "vite",
+    "start": "NODE_OPTIONS=--openssl-legacy-provider react-scripts start",
-    "build": "tsc && vite build",
+    "build": "NODE_OPTIONS=--openssl-legacy-provider craco build",
-    "preview": "vite preview",
+    "test": "react-scripts test",
+    "eject": "react-scripts eject",
     "update:adapter": "cd .. && npm run package:lib && cd sasjs-tests && npm i ../build/sasjs-adapter-5.0.0.tgz",
-    "deploy:tests": "rsync -avhe ssh ./dist/* --delete $SSH_ACCOUNT:$DEPLOY_PATH || npm run deploy:tests-win",
+    "deploy:tests": "rsync -avhe ssh ./build/* --delete $SSH_ACCOUNT:$DEPLOY_PATH || npm run deploy:tests-win",
-    "deploy:tests-win": "scp %DEPLOY_PATH% ./dist/*",
+    "deploy:tests-win": "scp %DEPLOY_PATH% ./build/*",
     "deploy": "npm run update:adapter && npm run build && npm run deploy:tests"
   },
+  "eslintConfig": {
+    "extends": "react-app"
+  },
+  "browserslist": {
+    "production": [
+      ">0.2%",
+      "not dead",
+      "not op_mini all"
+    ],
+    "development": [
+      "last 1 chrome version",
+      "last 1 firefox version",
+      "last 1 safari version"
+    ]
+  },
   "devDependencies": {
-    "typescript": "~5.9.3",
+    "@craco/craco": "6.4.3",
-    "vite": "npm:rolldown-vite@7.2.2"
+    "node-sass": "9.0.0",
-  },
+    "source-map-loader": "0.2.4"
-  "overrides": {
-    "vite": "npm:rolldown-vite@7.2.2"
-  },
-  "dependencies": {
-    "@sasjs/adapter": "^4.14.0"
   }
 }

sasjs-tests/public/config.json

@@ -2,12 +2,11 @@
   "userName": "",
   "password": "",
   "sasJsConfig": {
-    "loginMechanism": "Redirected",
     "serverUrl": "",
     "appLoc": "/Public/app/adapter-tests/services",
-    "serverType": "SASVIYA",
+    "serverType": "SASJS",
     "debug": false,
-    "contextName": "SAS Job Execution compute context",
+    "contextName": "sasjs adapter compute context",
     "useComputeApi": true
   }
 }

sasjs-tests/public/index.html

@@ -0,0 +1,40 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <link rel="icon" href="%PUBLIC_URL%/favicon.png" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <meta name="theme-color" content="#000000" />
+    <meta name="description" content="Tests for SASjs" />
+    <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
+    <!--
+      manifest.json provides metadata used when your web app is installed on a
+      user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
+    -->
+    <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
+    <!--
+      Notice the use of %PUBLIC_URL% in the tags above.
+      It will be replaced with the URL of the `public` folder during the build.
+      Only files inside the `public` folder can be referenced from the HTML.
+
+      Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
+      work correctly both with client-side routing and a non-root public URL.
+      Learn how to configure a non-root public URL by running `npm run build`.
+    -->
+    <title>SASjs Tests</title>
+  </head>
+  <body>
+    <noscript>You need to enable JavaScript to run this app.</noscript>
+    <div id="root"></div>
+    <!--
+      This HTML file is a template.
+      If you open it directly in the browser, you will see an empty page.
+
+      You can add webfonts, meta tags, or analytics to this file.
+      The build step will place the bundled scripts into the <body> tag.
+
+      To begin the development, run `npm start` or `yarn start`.
+      To create a production bundle, use `npm run build` or `yarn build`.
+    -->
+  </body>
+</html>

sasjs-tests/public/manifest.json

@@ -0,0 +1,25 @@
+{
+  "short_name": "React App",
+  "name": "Create React App Sample",
+  "icons": [
+    {
+      "src": "favicon.ico",
+      "sizes": "64x64 32x32 24x24 16x16",
+      "type": "image/x-icon"
+    },
+    {
+      "src": "logo192.png",
+      "type": "image/png",
+      "sizes": "192x192"
+    },
+    {
+      "src": "logo512.png",
+      "type": "image/png",
+      "sizes": "512x512"
+    }
+  ],
+  "start_url": ".",
+  "display": "standalone",
+  "theme_color": "#000000",
+  "background_color": "#ffffff"
+}

sasjs-tests/sasjs/sasjsconfig.json

@@ -20,7 +20,7 @@
       "streamConfig": {
         "streamWeb": true,
         "streamWebFolder": "webv",
-        "webSourcePath": "dist",
+        "webSourcePath": "build",
         "streamServiceName": "adapter-tests",
         "assetPaths": []
       }
@@ -40,7 +40,7 @@
       "streamConfig": {
         "streamWeb": true,
         "streamWebFolder": "webv",
-        "webSourcePath": "dist",
+        "webSourcePath": "build",
         "streamServiceName": "adapter-tests",
         "assetPaths": []
       }

sasjs-tests/src/App.tsx

@@ -0,0 +1,42 @@
+import React, { ReactElement, useState, useContext, useEffect } from 'react'
+import { TestSuiteRunner, TestSuite, AppContext } from '@sasjs/test-framework'
+import { basicTests } from './testSuites/Basic'
+import { sendArrTests, sendObjTests } from './testSuites/RequestData'
+import { specialCaseTests } from './testSuites/SpecialCases'
+import { sasjsRequestTests } from './testSuites/SasjsRequests'
+import '@sasjs/test-framework/dist/index.css'
+import { computeTests } from './testSuites/Compute'
+import { fileUploadTests } from './testSuites/FileUpload'
+
+const App = (): ReactElement<{}> => {
+  const { adapter, config } = useContext(AppContext)
+  const [testSuites, setTestSuites] = useState<TestSuite[]>([])
+  const appLoc = config.sasJsConfig.appLoc
+
+  useEffect(() => {
+    if (adapter) {
+      const testSuites = [
+        basicTests(adapter, config.userName, config.password),
+        sendArrTests(adapter, appLoc),
+        sendObjTests(adapter),
+        // specialCaseTests(adapter),
+        sasjsRequestTests(adapter),
+        fileUploadTests(adapter)
+      ]
+
+      if (adapter.getSasjsConfig().serverType === 'SASVIYA') {
+        testSuites.push(computeTests(adapter, appLoc))
+      }
+
+      setTestSuites(testSuites)
+    }
+  }, [adapter, config, appLoc])
+
+  return (
+    <div className="app">
+      {adapter && testSuites && <TestSuiteRunner testSuites={testSuites} />}
+    </div>
+  )
+}
+
+export default App

sasjs-tests/src/Login.scss

@@ -0,0 +1,34 @@
+.login-container {
+  display: flex;
+  flex-direction: column;
+  height: 100vh;
+  justify-content: center;
+  align-items: center;
+
+  img {
+    max-width: 30%;
+  }
+
+  form {
+    width: 33%;
+    margin-top: 3%;
+    display: flex;
+    flex-direction: column;
+
+    .row {
+      input {
+        font-size: 0.9em;
+      }
+
+      label {
+        font-weight: bold;
+        font-size: 0.9em;
+        margin-bottom: 4px;
+      }
+    }
+
+    .submit-button {
+      margin-top: 16px;
+    }
+  }
+}

sasjs-tests/src/Login.tsx

@@ -0,0 +1,54 @@
+import React, { ReactElement, useState, useCallback, useContext } from 'react'
+import './Login.scss'
+import { AppContext } from '@sasjs/test-framework'
+import { Redirect } from 'react-router-dom'
+
+const Login = (): ReactElement<{}> => {
+  const [username, setUsername] = useState('')
+  const [password, setPassword] = useState('')
+  const appContext = useContext(AppContext)
+
+  const handleSubmit = useCallback(
+    (e: any) => {
+      e.preventDefault()
+      appContext.adapter.logIn(username, password).then((res) => {
+        appContext.setIsLoggedIn(res.isLoggedIn)
+      })
+    },
+    [username, password, appContext]
+  )
+
+  return !appContext.isLoggedIn ? (
+    <div className="login-container">
+      <img src="sasjs-logo.png" alt="SASjs Logo" />
+      <form onSubmit={handleSubmit}>
+        <div className="row">
+          <label>User Name</label>
+          <input
+            placeholder="User Name"
+            value={username}
+            required
+            onChange={(e: any) => setUsername(e.target.value)}
+          />
+        </div>
+        <div className="row">
+          <label>Password</label>
+          <input
+            placeholder="Password"
+            type="password"
+            value={password}
+            required
+            onChange={(e: any) => setPassword(e.target.value)}
+          />
+        </div>
+        <button type="submit" className="submit-button">
+          Log In
+        </button>
+      </form>
+    </div>
+  ) : (
+    <Redirect to="/" />
+  )
+}
+
+export default Login

sasjs-tests/src/PrivateRoute.tsx

@@ -0,0 +1,23 @@
+import React, { ReactElement, useContext, FunctionComponent } from 'react'
+import { Redirect, Route } from 'react-router-dom'
+import { AppContext } from '@sasjs/test-framework'
+
+interface PrivateRouteProps {
+  component: FunctionComponent
+  exact?: boolean
+  path: string
+}
+
+const PrivateRoute = (
+  props: PrivateRouteProps
+): ReactElement<PrivateRouteProps> => {
+  const { component, path, exact } = props
+  const appContext = useContext(AppContext)
+  return appContext.isLoggedIn ? (
+    <Route component={component} path={path} exact={exact} />
+  ) : (
+    <Redirect to="/login" />
+  )
+}
+
+export default PrivateRoute

sasjs-tests/src/components/LoginForm.css

@@ -1,65 +0,0 @@
-:host {
-  display: block;
-  max-width: 400px;
-  margin: 100px auto;
-  padding: 40px;
-  background: white;
-  border-radius: 8px;
-  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
-}
-
-h1 {
-  text-align: center;
-  margin-bottom: 30px;
-  color: #2c3e50;
-}
-
-form {
-  display: flex;
-  flex-direction: column;
-  gap: 15px;
-}
-
-label {
-  font-weight: 600;
-  margin-bottom: 5px;
-}
-
-input {
-  padding: 10px;
-  border: 1px solid #ddd;
-  border-radius: 4px;
-  font-size: 14px;
-
-  &:focus {
-    outline: none;
-    border-color: #3498db;
-  }
-}
-
-button {
-  padding: 12px;
-  background: #3498db;
-  color: white;
-  border: none;
-  border-radius: 4px;
-  font-size: 16px;
-  font-weight: 600;
-  cursor: pointer;
-  transition: background 0.2s;
-
-  &:hover:not(:disabled) {
-    background: #2980b9;
-  }
-
-  &:disabled {
-    opacity: 0.6;
-    cursor: not-allowed;
-  }
-}
-
-.error {
-  color: #e74c3c;
-  font-size: 14px;
-  min-height: 20px;
-}

sasjs-tests/src/components/LoginForm.ts

@@ -1,93 +0,0 @@
-import { appContext } from '../core/AppContext'
-import styles from './LoginForm.css?inline'
-
-export class LoginForm extends HTMLElement {
-  private static styleSheet = new CSSStyleSheet()
-  private shadow: ShadowRoot
-
-  static {
-    this.styleSheet.replaceSync(styles)
-  }
-
-  constructor() {
-    super()
-    this.shadow = this.attachShadow({ mode: 'open' })
-    this.shadow.adoptedStyleSheets = [LoginForm.styleSheet]
-  }
-
-  connectedCallback() {
-    this.render()
-    this.attachEventListeners()
-  }
-
-  render() {
-    this.shadow.innerHTML = `
-      <h1>SASjs Tests</h1>
-      <form id="login-form">
-        <label for="username">Username</label>
-        <input type="text" id="username" name="username" placeholder="Enter username" required />
-
-        <label for="password">Password</label>
-        <input type="password" id="password" name="password" placeholder="Enter password" required />
-
-        <button type="submit" id="submit-btn">Log In</button>
-        <div class="error" id="error"></div>
-      </form>
-    `
-  }
-
-  attachEventListeners() {
-    const form = this.shadow.getElementById('login-form') as HTMLFormElement
-    form.addEventListener('submit', async (e) => {
-      e.preventDefault()
-      await this.handleLogin()
-    })
-  }
-
-  async handleLogin() {
-    const username = (
-      this.shadow.getElementById('username') as HTMLInputElement
-    ).value
-    const password = (
-      this.shadow.getElementById('password') as HTMLInputElement
-    ).value
-    const submitBtn = this.shadow.getElementById(
-      'submit-btn'
-    ) as HTMLButtonElement
-    const errorDiv = this.shadow.getElementById('error') as HTMLDivElement
-
-    errorDiv.textContent = ''
-    submitBtn.textContent = 'Logging in...'
-    submitBtn.disabled = true
-
-    try {
-      const adapter = appContext.getAdapter()
-      if (!adapter) {
-        throw new Error('Adapter not initialized')
-      }
-
-      const response = await adapter.logIn(username, password)
-
-      if (response && response.isLoggedIn) {
-        appContext.setIsLoggedIn(true)
-        this.dispatchEvent(
-          new CustomEvent('login-success', {
-            bubbles: true,
-            composed: true
-          })
-        )
-      } else {
-        throw new Error('Login failed')
-      }
-    } catch (error: unknown) {
-      errorDiv.textContent =
-        error instanceof Error
-          ? error.message
-          : 'Login failed. Please try again.'
-      submitBtn.textContent = 'Log In'
-      submitBtn.disabled = false
-    }
-  }
-}
-
-customElements.define('login-form', LoginForm)

sasjs-tests/src/components/RequestsModal.css

@@ -1,193 +0,0 @@
-:host {
-  display: contents;
-}
-
-button {
-  padding: 8px 16px;
-  background: #3498db;
-  color: white;
-  border: none;
-  border-radius: 4px;
-  cursor: pointer;
-  font-size: 14px;
-  margin-left: 10px;
-
-  &:hover {
-    background: #2980b9;
-  }
-}
-
-dialog {
-  max-width: 95vw;
-  max-height: 95vh;
-  width: 1400px;
-  padding: 0;
-  border: none;
-  border-radius: 8px;
-  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
-  background: #2c3e50;
-  color: #ecf0f1;
-
-  &::backdrop {
-    background: rgba(0, 0, 0, 0.5);
-  }
-}
-
-.modal-header {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  padding: 20px;
-  border-bottom: 1px solid #34495e;
-
-  h2 {
-    margin: 0;
-    color: #ecf0f1;
-    font-size: 20px;
-  }
-}
-
-.close-btn {
-  background: transparent;
-  color: #ecf0f1;
-  font-size: 24px;
-  padding: 0;
-  width: 32px;
-  height: 32px;
-  cursor: pointer;
-  border-radius: 4px;
-  margin: 0;
-
-  &:hover {
-    background: #34495e;
-  }
-}
-
-.modal-content {
-  padding: 20px;
-  overflow-y: auto;
-  max-height: calc(95vh - 80px);
-}
-
-.debug-message {
-  text-align: center;
-  padding: 60px 20px;
-
-  .icon {
-    font-size: 64px;
-    margin-bottom: 20px;
-  }
-
-  h3 {
-    margin: 10px 0;
-    color: #ecf0f1;
-  }
-
-  span {
-    color: #95a5a6;
-  }
-}
-
-.requests-list {
-  display: flex;
-  flex-direction: column;
-  gap: 10px;
-}
-
-details {
-  border: 1px solid #34495e;
-  border-radius: 4px;
-  background: #34495e;
-
-  &[open] summary::before {
-    transform: rotate(90deg);
-  }
-}
-
-summary {
-  padding: 15px;
-  cursor: pointer;
-  user-select: none;
-  list-style: none;
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  transition: background 0.2s;
-
-  &::-webkit-details-marker {
-    display: none;
-  }
-
-  &::before {
-    content: '▶';
-    display: inline-block;
-    margin-right: 10px;
-    transition: transform 0.2s;
-  }
-
-  &:hover {
-    background: #3d5266;
-  }
-}
-
-.request-timestamp {
-  color: #95a5a6;
-  font-size: 13px;
-}
-
-.request-content {
-  padding: 0 15px 15px 15px;
-}
-
-.tabs {
-  display: flex;
-  gap: 10px;
-  padding-bottom: 10px;
-  border-bottom: 1px solid #2c3e50;
-  margin-bottom: 10px;
-}
-
-.tab-btn {
-  padding: 8px 16px;
-  background: transparent;
-  color: #95a5a6;
-  border: none;
-  border-bottom: 2px solid transparent;
-  cursor: pointer;
-  font-size: 14px;
-  margin: 0;
-  border-radius: 0;
-
-  &:hover {
-    color: #ecf0f1;
-    background: transparent;
-  }
-
-  &.active {
-    color: #3498db;
-    border-bottom-color: #3498db;
-    background: transparent;
-  }
-}
-
-.tab-pane {
-  display: none;
-
-  &.active {
-    display: block;
-  }
-}
-
-pre {
-  background: #1e2832;
-  padding: 15px;
-  border-radius: 4px;
-  overflow-x: auto;
-  margin: 0;
-  color: #ecf0f1;
-  font-family: 'Courier New', monospace;
-  font-size: 13px;
-  line-height: 1.5;
-  white-space: pre-wrap;
-  word-wrap: break-word;
-}

sasjs-tests/src/components/RequestsModal.ts

@@ -1,180 +0,0 @@
-import type { SASjsRequest } from '@sasjs/adapter'
-import { appContext } from '../core/AppContext'
-import styles from './RequestsModal.css?inline'
-
-export class RequestsModal extends HTMLElement {
-  private static styleSheet = new CSSStyleSheet()
-  private shadow: ShadowRoot
-  private dialog: HTMLDialogElement | null = null
-
-  static {
-    this.styleSheet.replaceSync(styles)
-  }
-
-  constructor() {
-    super()
-    this.shadow = this.attachShadow({ mode: 'open' })
-    this.shadow.adoptedStyleSheets = [RequestsModal.styleSheet]
-  }
-
-  connectedCallback() {
-    this.render()
-    this.attachEventListeners()
-  }
-
-  render() {
-    this.shadow.innerHTML = `
-      <dialog id="requests-dialog">
-        <div class="modal-header">
-          <h2 id="modal-title"></h2>
-          <button class="close-btn" id="close-btn">×</button>
-        </div>
-        <div class="modal-content" id="modal-content"></div>
-      </dialog>
-    `
-  }
-
-  attachEventListeners() {
-    const dialog = this.shadow.getElementById(
-      'requests-dialog'
-    ) as HTMLDialogElement
-    const closeBtn = this.shadow.getElementById('close-btn')
-
-    this.dialog = dialog
-
-    closeBtn?.addEventListener('click', () => this.closeModal())
-    dialog?.addEventListener('click', (e) => {
-      if (e.target === dialog) {
-        this.closeModal()
-      }
-    })
-  }
-
-  openModal() {
-    if (!this.dialog) return
-
-    const adapter = appContext.getAdapter()
-    if (!adapter) return
-
-    const requests = adapter.getSasRequests()
-
-    const title = this.shadow.getElementById('modal-title')
-    const content = this.shadow.getElementById('modal-content')
-
-    if (!title || !content) return
-
-    title.textContent = 'Last 20 requests'
-
-    if (!requests || requests.length === 0) {
-      content.innerHTML = `
-        <div class="debug-message">
-          <div class="icon">🐛</div>
-          <h3>There are no requests available.</h3>
-          <span>Please run a test and check again.</span>
-        </div>
-      `
-    } else {
-      content.innerHTML = `
-        <div class="requests-list">
-          ${requests
-            .map((request, index) => this.renderRequest(request, index))
-            .join('')}
-        </div>
-      `
-
-      this.attachTabListeners()
-    }
-
-    this.dialog.showModal()
-  }
-
-  closeModal() {
-    this.dialog?.close()
-  }
-
-  renderRequest(request: SASjsRequest, index: number): string {
-    const timestamp = new Date(request.timestamp)
-    const formattedDate = timestamp.toLocaleString('en-US', {
-      weekday: 'long',
-      year: 'numeric',
-      month: 'long',
-      day: 'numeric',
-      hour: 'numeric',
-      minute: 'numeric',
-      second: 'numeric'
-    })
-    const timeAgo = this.getTimeAgo(timestamp)
-
-    return `
-      <details data-index="${index}">
-        <summary>
-          <span>${request.serviceLink}</span>
-          <span class="request-timestamp">${formattedDate} (${timeAgo})</span>
-        </summary>
-        <div class="request-content">
-          <div class="tabs">
-            <button class="tab-btn active" data-tab="log-${index}">Log</button>
-            <button class="tab-btn" data-tab="source-${index}">Source Code</button>
-            <button class="tab-btn" data-tab="generated-${index}">Generated Code</button>
-          </div>
-          <div class="tab-panes">
-            <div class="tab-pane active" id="log-${index}">
-              <pre>${this.decodeHtml(request.logFile)}</pre>
-            </div>
-            <div class="tab-pane" id="source-${index}">
-              <pre>${this.decodeHtml(request.sourceCode)}</pre>
-            </div>
-            <div class="tab-pane" id="generated-${index}">
-              <pre>${this.decodeHtml(request.generatedCode)}</pre>
-            </div>
-          </div>
-        </div>
-      </details>
-    `
-  }
-
-  attachTabListeners() {
-    const tabBtns = this.shadow.querySelectorAll('.tab-btn')
-    tabBtns.forEach((btn) => {
-      btn.addEventListener('click', (e) => {
-        const target = e.currentTarget as HTMLElement
-        const tabId = target.getAttribute('data-tab')
-        if (!tabId) return
-
-        const container = target.closest('.request-content')
-        if (!container) return
-
-        container
-          .querySelectorAll('.tab-btn')
-          .forEach((b) => b.classList.remove('active'))
-        container
-          .querySelectorAll('.tab-pane')
-          .forEach((p) => p.classList.remove('active'))
-
-        target.classList.add('active')
-        const pane = container.querySelector(`#${tabId}`)
-        pane?.classList.add('active')
-      })
-    })
-  }
-
-  decodeHtml(encodedString: string): string {
-    const tempElement = document.createElement('textarea')
-    tempElement.innerHTML = encodedString
-    return tempElement.value
-  }
-
-  getTimeAgo(date: Date): string {
-    const seconds = Math.floor((new Date().getTime() - date.getTime()) / 1000)
-
-    if (seconds < 60) return `${seconds} seconds ago`
-    const minutes = Math.floor(seconds / 60)
-    if (minutes < 60) return `${minutes} minute${minutes !== 1 ? 's' : ''} ago`
-    const hours = Math.floor(minutes / 60)
-    if (hours < 24) return `${hours} hour${hours !== 1 ? 's' : ''} ago`
-    const days = Math.floor(hours / 24)
-    return `${days} day${days !== 1 ? 's' : ''} ago`
-  }
-}
-
-customElements.define('requests-modal', RequestsModal)

sasjs-tests/src/components/TestCard.css

@@ -1,126 +0,0 @@
-:host {
-  display: block;
-  border: 2px solid #ecf0f1;
-  border-radius: 6px;
-  padding: 15px;
-  background: #fafafa;
-  transition: border-color 0.2s;
-
-  &[status='passed'] {
-    border-color: #27ae60;
-    background: #f0fff4;
-  }
-
-  &[status='failed'] {
-    border-color: #e74c3c;
-    background: #fff5f5;
-  }
-
-  &[status='running'] {
-    border-color: #f39c12;
-    background: #fffbf0;
-  }
-
-  &[status='pending'] {
-    border-color: #95a5a6;
-    background: #f8f9fa;
-  }
-}
-
-.header {
-  display: flex;
-  align-items: center;
-  gap: 10px;
-  margin-bottom: 10px;
-}
-
-.status-icon {
-  font-size: 20px;
-  font-weight: bold;
-
-  &.passed {
-    color: #27ae60;
-  }
-  &.failed {
-    color: #e74c3c;
-  }
-  &.running {
-    color: #f39c12;
-    animation: spin 1s linear infinite;
-  }
-  &.pending {
-    color: #95a5a6;
-  }
-}
-
-@keyframes spin {
-  from {
-    transform: rotate(0deg);
-  }
-  to {
-    transform: rotate(360deg);
-  }
-}
-
-h3 {
-  font-size: 16px;
-  color: #2c3e50;
-  margin: 0;
-}
-
-.description {
-  color: #7f8c8d;
-  font-size: 14px;
-  margin-bottom: 10px;
-}
-
-.details {
-  margin-top: 10px;
-  font-size: 14px;
-}
-
-.time {
-  color: #7f8c8d;
-  margin-bottom: 5px;
-}
-
-.error {
-  margin-top: 10px;
-
-  strong {
-    color: #e74c3c;
-    display: block;
-    margin-bottom: 5px;
-  }
-
-  pre {
-    background: #2c3e50;
-    color: #ecf0f1;
-    padding: 10px;
-    border-radius: 4px;
-    overflow-x: auto;
-    font-size: 12px;
-    line-height: 1.4;
-    margin: 0;
-  }
-}
-
-button {
-  margin-top: 10px;
-  padding: 6px 12px;
-  background: #3498db;
-  color: white;
-  border: none;
-  border-radius: 4px;
-  cursor: pointer;
-  font-size: 13px;
-
-  &:hover:not(:disabled) {
-    background: #2980b9;
-  }
-
-  &:disabled {
-    opacity: 0.6;
-    cursor: not-allowed;
-  }
-}

sasjs-tests/src/components/TestCard.ts

@@ -1,113 +0,0 @@
-import type { CompletedTest } from '../core/TestRunner'
-import type { TestStatus } from '../types'
-import styles from './TestCard.css?inline'
-
-export class TestCard extends HTMLElement {
-  private static styleSheet = new CSSStyleSheet()
-  private shadow: ShadowRoot
-  private _testData: CompletedTest | null = null
-
-  static {
-    this.styleSheet.replaceSync(styles)
-  }
-
-  static get observedAttributes() {
-    return ['status', 'execution-time']
-  }
-
-  constructor() {
-    super()
-    this.shadow = this.attachShadow({ mode: 'open' })
-    this.shadow.adoptedStyleSheets = [TestCard.styleSheet]
-  }
-
-  connectedCallback() {
-    this.render()
-  }
-
-  attributeChangedCallback(_name: string, oldValue: string, newValue: string) {
-    if (oldValue !== newValue) {
-      this.render()
-    }
-  }
-
-  set testData(data: CompletedTest) {
-    this._testData = data
-    this.setAttribute('status', data.status)
-    if (data.executionTime) {
-      this.setAttribute('execution-time', data.executionTime.toString())
-    }
-    this.render()
-  }
-
-  get testData(): CompletedTest | null {
-    return this._testData
-  }
-
-  render() {
-    if (!this._testData) return
-
-    const { test, status, executionTime, error } = this._testData
-    const statusIcon = this.getStatusIcon(status)
-
-    this.shadow.innerHTML = `
-      <div class="header">
-        <span class="status-icon ${status}">${statusIcon}</span>
-        <h3>${test.title}</h3>
-      </div>
-      <p class="description">${test.description}</p>
-
-      ${
-        executionTime
-          ? `
-        <div class="details">
-          <div class="time">Time: ${executionTime.toFixed(3)}s</div>
-        </div>
-      `
-          : ''
-      }
-
-      ${
-        error
-          ? `
-        <div class="error">
-          <strong>Error:</strong>
-          <pre>${(error as Error).message || String(error)}</pre>
-        </div>
-      `
-          : ''
-      }
-
-      <button id="rerun-btn">Rerun</button>
-    `
-
-    const rerunBtn = this.shadow.getElementById('rerun-btn')
-    if (rerunBtn) {
-      rerunBtn.addEventListener('click', () => {
-        this.dispatchEvent(
-          new CustomEvent('rerun', {
-            bubbles: true,
-            composed: true
-          })
-        )
-      })
-    }
-  }
-
-  getStatusIcon(status: TestStatus): string {
-    switch (status) {
-      case 'passed':
-        return '✓'
-      case 'failed':
-        return '✗'
-      case 'running':
-        return '⟳'
-      case 'pending':
-        return '○'
-      default:
-        return '?'
-    }
-  }
-}
-
-customElements.define('test-card', TestCard)

sasjs-tests/src/components/TestSuite.css

@@ -1,34 +0,0 @@
-:host {
-  display: block;
-  background: white;
-  border-radius: 8px;
-  padding: 20px;
-  margin-bottom: 20px;
-  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
-}
-
-.header {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  margin-bottom: 15px;
-  padding-bottom: 10px;
-  border-bottom: 1px solid #ecf0f1;
-}
-
-h2 {
-  color: #2c3e50;
-  font-size: 20px;
-  margin: 0;
-}
-
-.stats {
-  font-size: 14px;
-  color: #7f8c8d;
-}
-
-.tests {
-  display: grid;
-  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
-  gap: 15px;
-}

sasjs-tests/src/components/TestSuite.ts

@@ -1,117 +0,0 @@
-import type { CompletedTestSuite } from '../core/TestRunner'
-import { TestCard } from './TestCard'
-import styles from './TestSuite.css?inline'
-
-export class TestSuiteElement extends HTMLElement {
-  private static styleSheet = new CSSStyleSheet()
-  private shadow: ShadowRoot
-  private _suiteData: CompletedTestSuite | null = null
-  private _suiteIndex: number = 0
-
-  static {
-    this.styleSheet.replaceSync(styles)
-  }
-
-  constructor() {
-    super()
-    this.shadow = this.attachShadow({ mode: 'open' })
-    this.shadow.adoptedStyleSheets = [TestSuiteElement.styleSheet]
-  }
-
-  connectedCallback() {
-    this.render()
-  }
-
-  set suiteData(data: CompletedTestSuite) {
-    this._suiteData = data
-    this.render()
-  }
-
-  get suiteData(): CompletedTestSuite | null {
-    return this._suiteData
-  }
-
-  set suiteIndex(index: number) {
-    this._suiteIndex = index
-  }
-
-  get suiteIndex(): number {
-    return this._suiteIndex
-  }
-
-  updateTest(testIndex: number, testData: any) {
-    if (!this._suiteData) return
-
-    // Update the data
-    this._suiteData.completedTests[testIndex] = testData
-
-    // Update stats
-    this.updateStats()
-
-    // Update the specific test card
-    const testsContainer = this.shadow.getElementById('tests-container')
-    if (testsContainer) {
-      const cards = testsContainer.querySelectorAll('test-card')
-      const card = cards[testIndex] as TestCard
-      if (card) {
-        card.testData = testData
-      }
-    }
-  }
-
-  updateStats() {
-    if (!this._suiteData) return
-
-    const { completedTests } = this._suiteData
-    const passed = completedTests.filter((t) => t.status === 'passed').length
-    const failed = completedTests.filter((t) => t.status === 'failed').length
-    const running = completedTests.filter((t) => t.status === 'running').length
-
-    const statsEl = this.shadow.querySelector('.stats')
-    if (statsEl) {
-      statsEl.textContent = `Passed: ${passed} | Failed: ${failed} | Running: ${running}`
-    }
-  }
-
-  render() {
-    if (!this._suiteData) return
-
-    const { name, completedTests } = this._suiteData
-    const passed = completedTests.filter((t) => t.status === 'passed').length
-    const failed = completedTests.filter((t) => t.status === 'failed').length
-    const running = completedTests.filter((t) => t.status === 'running').length
-
-    this.shadow.innerHTML = `
-      <div class="header">
-        <h2>${name}</h2>
-        <div class="stats">Passed: ${passed} | Failed: ${failed} | Running: ${running}</div>
-      </div>
-      <div class="tests" id="tests-container"></div>
-    `
-
-    const testsContainer = this.shadow.getElementById('tests-container')
-    if (testsContainer) {
-      completedTests.forEach((completedTest, testIndex) => {
-        const card = document.createElement('test-card') as TestCard
-        card.testData = completedTest
-
-        card.addEventListener('rerun', () => {
-          this.dispatchEvent(
-            new CustomEvent('rerun-test', {
-              bubbles: true,
-              composed: true,
-              detail: {
-                suiteIndex: this._suiteIndex,
-                testIndex
-              }
-            })
-          )
-        })
-
-        testsContainer.appendChild(card)
-      })
-    }
-  }
-}
-
-customElements.define('test-suite', TestSuiteElement)

sasjs-tests/src/components/TestsView.css

@@ -1,104 +0,0 @@
-:host {
-  display: block;
-  width: 100%;
-  padding: 80px 20px 20px 20px;
-}
-
-.header {
-  position: fixed;
-  top: 0;
-  left: 0;
-  right: 0;
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  padding: 15px 20px;
-  background: white;
-  border-bottom: 2px solid #3498db;
-  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
-  z-index: 100;
-  height: 32px;
-}
-
-h1 {
-  color: #2c3e50;
-  margin: 0;
-  font-size: 20px;
-}
-
-.header-controls {
-  display: flex;
-  align-items: center;
-  gap: 15px;
-}
-
-.logout-btn {
-  padding: 8px 16px;
-  background: #e74c3c;
-  color: white;
-  border: none;
-  border-radius: 4px;
-  cursor: pointer;
-  font-size: 14px;
-
-  &:hover {
-    background: #c0392b;
-  }
-}
-
-.requests-btn {
-  padding: 8px 16px;
-  background: #3498db;
-  color: white;
-  border: none;
-  border-radius: 4px;
-  cursor: pointer;
-  font-size: 14px;
-
-  &:hover {
-    background: #2980b9;
-  }
-}
-
-.debug-toggle {
-  display: flex;
-  align-items: center;
-  gap: 8px;
-
-  label {
-    font-size: 14px;
-    color: #2c3e50;
-    cursor: pointer;
-  }
-}
-
-input[type='checkbox'] {
-  width: 18px;
-  height: 18px;
-  cursor: pointer;
-}
-
-.run-btn {
-  padding: 8px 16px;
-  background: #27ae60;
-  color: white;
-  border: none;
-  border-radius: 4px;
-  font-size: 14px;
-  font-weight: 600;
-  cursor: pointer;
-
-  &:hover:not(:disabled) {
-    background: #229954;
-  }
-
-  &:disabled {
-    opacity: 0.6;
-    cursor: not-allowed;
-  }
-}
-
-.results {
-  margin-top: 64px;
-  width: 100%;
-}

sasjs-tests/src/components/TestsView.ts

@@ -1,163 +0,0 @@
-import { appContext } from '../core/AppContext'
-import { TestRunner, type CompletedTestSuite } from '../core/TestRunner'
-import type { TestSuite } from '../types'
-import { TestSuiteElement } from './TestSuite'
-import styles from './TestsView.css?inline'
-
-export class TestsView extends HTMLElement {
-  private static styleSheet = new CSSStyleSheet()
-  private shadow: ShadowRoot
-  private testRunner: TestRunner | null = null
-  private _testSuites: TestSuite[] = []
-  private debugMode: boolean = false
-
-  static {
-    this.styleSheet.replaceSync(styles)
-  }
-
-  constructor() {
-    super()
-    this.shadow = this.attachShadow({ mode: 'open' })
-    this.shadow.adoptedStyleSheets = [TestsView.styleSheet]
-  }
-
-  connectedCallback() {
-    this.render()
-  }
-
-  get testSuites(): TestSuite[] {
-    return this._testSuites
-  }
-
-  set testSuites(suites: TestSuite[]) {
-    this._testSuites = suites
-    this.testRunner = new TestRunner(suites)
-    this.render()
-  }
-
-  render() {
-    this.shadow.innerHTML = `
-      <div class="header">
-        <h1>SASjs Adapter Tests</h1>
-        <div class="header-controls">
-          <div class="debug-toggle">
-            <input type="checkbox" id="debug-toggle" ${
-              this.debugMode ? 'checked' : ''
-            } />
-            <label for="debug-toggle">Debug Mode</label>
-          </div>
-          <button class="run-btn" id="run-btn">Run All Tests</button>
-          <button class="logout-btn" id="logout-btn">Logout</button>
-          <button class="requests-btn" id="requests-btn">View Requests</button>
-        </div>
-      </div>
-
-      <div class="results" id="results"></div>
-    `
-
-    const logoutBtn = this.shadow.getElementById('logout-btn')
-    logoutBtn?.addEventListener('click', () => this.handleLogout())
-
-    const debugToggle = this.shadow.getElementById(
-      'debug-toggle'
-    ) as HTMLInputElement
-    debugToggle?.addEventListener('change', (e) => this.handleDebugToggle(e))
-
-    const runBtn = this.shadow.getElementById('run-btn') as HTMLButtonElement
-    runBtn?.addEventListener('click', () => this.handleRunTests(runBtn))
-
-    const requestsBtn = this.shadow.getElementById('requests-btn')
-    requestsBtn?.addEventListener('click', () => this.handleViewRequests())
-  }
-
-  handleViewRequests() {
-    const requestsModal = document.querySelector('requests-modal') as any
-    if (requestsModal && requestsModal.openModal) {
-      requestsModal.openModal()
-    }
-  }
-
-  handleDebugToggle(e: Event) {
-    const checkbox = e.target as HTMLInputElement
-    this.debugMode = checkbox.checked
-
-    const adapter = appContext.getAdapter()
-    if (adapter) {
-      adapter.setDebugState(this.debugMode)
-    }
-  }
-
-  async handleLogout() {
-    const adapter = appContext.getAdapter()
-    if (adapter) {
-      await adapter.logOut()
-      appContext.setIsLoggedIn(false)
-      this.dispatchEvent(
-        new CustomEvent('logout', {
-          bubbles: true,
-          composed: true
-        })
-      )
-    }
-  }
-
-  async handleRunTests(runBtn: HTMLButtonElement) {
-    if (!this.testRunner) return
-
-    runBtn.disabled = true
-    runBtn.textContent = 'Running...'
-
-    const resultsContainer = this.shadow.getElementById('results')
-    if (resultsContainer) {
-      resultsContainer.innerHTML = ''
-    }
-
-    await this.testRunner.runAllTests((completedSuites) => {
-      this.renderResults(resultsContainer!, completedSuites)
-    })
-
-    runBtn.disabled = false
-    runBtn.textContent = 'Run All Tests'
-  }
-
-  renderResults(container: HTMLElement, completedSuites: CompletedTestSuite[]) {
-    container.innerHTML = ''
-
-    completedSuites.forEach((suite, suiteIndex) => {
-      const suiteElement = document.createElement(
-        'test-suite'
-      ) as TestSuiteElement
-      suiteElement.suiteData = suite
-      suiteElement.suiteIndex = suiteIndex
-
-      suiteElement.addEventListener('rerun-test', ((e: CustomEvent) => {
-        const { suiteIndex, testIndex } = e.detail
-        this.handleRerunTest(suiteIndex, testIndex, container)
-      }) as EventListener)
-
-      container.appendChild(suiteElement)
-    })
-  }
-
-  async handleRerunTest(
-    suiteIndex: number,
-    testIndex: number,
-    container: HTMLElement
-  ) {
-    if (!this.testRunner) return
-
-    await this.testRunner.rerunTest(
-      suiteIndex,
-      testIndex,
-      (suiteIdx, testIdx, testData) => {
-        const suites = container.querySelectorAll('test-suite')
-        const suiteElement = suites[suiteIdx] as TestSuiteElement
-        if (suiteElement && suiteElement.updateTest) {
-          suiteElement.updateTest(testIdx, testData)
-        }
-      }
-    )
-  }
-}
-
-customElements.define('tests-view', TestsView)

sasjs-tests/src/components/index.ts

@@ -1,5 +0,0 @@
-export { LoginForm } from './LoginForm'
-export { TestCard } from './TestCard'
-export { TestSuiteElement } from './TestSuite'
-export { TestsView } from './TestsView'
-export { RequestsModal } from './RequestsModal'

sasjs-tests/src/config/loader.ts

@@ -1,14 +0,0 @@
-import type { AppConfig } from '../types'
-
-export interface ConfigWithCredentials extends AppConfig {
-  userName?: string
-  password?: string
-}
-
-export async function loadConfig(): Promise<ConfigWithCredentials> {
-  const response = await fetch('config.json')
-  if (!response.ok) {
-    throw new Error('Failed to load config.json')
-  }
-  return response.json()
-}

sasjs-tests/src/core/AppContext.ts

@@ -1,60 +0,0 @@
-import type SASjs from '@sasjs/adapter'
-import type { AppConfig, AppState } from '../types'
-
-export class AppContext {
-  private state: AppState = {
-    config: null,
-    adapter: null,
-    isLoggedIn: false
-  }
-
-  private listeners: Array<(state: AppState) => void> = []
-
-  getState(): AppState {
-    return { ...this.state }
-  }
-
-  setState(newState: Partial<AppState>): void {
-    this.state = { ...this.state, ...newState }
-    this.notifyListeners()
-  }
-
-  subscribe(listener: (state: AppState) => void): () => void {
-    this.listeners.push(listener)
-    // Return unsubscribe function
-    return () => {
-      this.listeners = this.listeners.filter((l) => l !== listener)
-    }
-  }
-
-  private notifyListeners(): void {
-    this.listeners.forEach((listener) => listener(this.getState()))
-  }
-
-  setConfig(config: AppConfig): void {
-    this.setState({ config })
-  }
-
-  setAdapter(adapter: SASjs): void {
-    this.setState({ adapter })
-  }
-
-  setIsLoggedIn(isLoggedIn: boolean): void {
-    this.setState({ isLoggedIn })
-  }
-
-  getAdapter(): SASjs | null {
-    return this.state.adapter
-  }
-
-  getConfig(): AppConfig | null {
-    return this.state.config
-  }
-
-  isUserLoggedIn(): boolean {
-    return this.state.isLoggedIn
-  }
-}
-
-// Global singleton instance
-export const appContext = new AppContext()

sasjs-tests/src/core/TestRunner.ts

@@ -1,173 +0,0 @@
-import type { Test, TestSuite, TestStatus } from '../types'
-import { runTest } from './runTest'
-
-export interface CompletedTest {
-  test: Test
-  result: boolean
-  error: unknown
-  executionTime: number
-  status: TestStatus
-}
-
-export interface CompletedTestSuite {
-  name: string
-  completedTests: CompletedTest[]
-}
-
-export class TestRunner {
-  private testSuites: TestSuite[]
-  private completedTestSuites: CompletedTestSuite[] = []
-  private isRunning = false
-
-  constructor(testSuites: TestSuite[]) {
-    this.testSuites = testSuites
-  }
-
-  async runAllTests(
-    onUpdate?: (
-      completedSuites: CompletedTestSuite[],
-      currentIndex: number
-    ) => void
-  ): Promise<CompletedTestSuite[]> {
-    this.isRunning = true
-    this.completedTestSuites = []
-
-    for (let i = 0; i < this.testSuites.length; i++) {
-      const suite = this.testSuites[i]
-      await this.runTestSuite(suite, i, onUpdate)
-    }
-
-    this.isRunning = false
-    return this.completedTestSuites
-  }
-
-  async runTestSuite(
-    suite: TestSuite,
-    suiteIndex: number,
-    onUpdate?: (
-      completedSuites: CompletedTestSuite[],
-      currentIndex: number
-    ) => void
-  ): Promise<CompletedTestSuite> {
-    const completedTests: CompletedTest[] = []
-    let context: unknown
-
-    // Run beforeAll if exists
-    if (suite.beforeAll) {
-      context = await suite.beforeAll()
-    }
-
-    // Run each test sequentially
-    for (let i = 0; i < suite.tests.length; i++) {
-      const test = suite.tests[i]
-      const currentIndex = suiteIndex * 1000 + i
-
-      // Set status to running
-      const runningTest: CompletedTest = {
-        test,
-        result: false,
-        error: null,
-        executionTime: 0,
-        status: 'running'
-      }
-      completedTests.push(runningTest)
-
-      // Notify update
-      if (onUpdate) {
-        this.completedTestSuites[suiteIndex] = {
-          name: suite.name,
-          completedTests: [...completedTests]
-        }
-        onUpdate([...this.completedTestSuites], currentIndex)
-      }
-
-      // Execute test
-      const result = await runTest(test, { data: context })
-
-      // Update with result
-      completedTests[i] = {
-        test,
-        result: result.result,
-        error: result.error,
-        executionTime: result.executionTime,
-        status: result.result ? 'passed' : 'failed'
-      }
-
-      // Notify update
-      if (onUpdate) {
-        this.completedTestSuites[suiteIndex] = {
-          name: suite.name,
-          completedTests: [...completedTests]
-        }
-        onUpdate([...this.completedTestSuites], currentIndex)
-      }
-    }
-
-    // Run afterAll if exists
-    if (suite.afterAll) {
-      await suite.afterAll()
-    }
-
-    return {
-      name: suite.name,
-      completedTests
-    }
-  }
-
-  async rerunTest(
-    suiteIndex: number,
-    testIndex: number,
-    onUpdate?: (
-      suiteIndex: number,
-      testIndex: number,
-      testData: CompletedTest
-    ) => void
-  ): Promise<void> {
-    const suite = this.testSuites[suiteIndex]
-    const test = suite.tests[testIndex]
-
-    let context: unknown
-    if (suite.beforeAll) {
-      context = await suite.beforeAll()
-    }
-
-    // Set status to running
-    this.completedTestSuites[suiteIndex].completedTests[testIndex].status =
-      'running'
-    if (onUpdate) {
-      onUpdate(
-        suiteIndex,
-        testIndex,
-        this.completedTestSuites[suiteIndex].completedTests[testIndex]
-      )
-    }
-
-    // Execute test
-    const result = await runTest(test, { data: context })
-
-    // Update with result
-    this.completedTestSuites[suiteIndex].completedTests[testIndex] = {
-      test,
-      result: result.result,
-      error: result.error,
-      executionTime: result.executionTime,
-      status: result.result ? 'passed' : 'failed'
-    }
-
-    if (onUpdate) {
-      onUpdate(
-        suiteIndex,
-        testIndex,
-        this.completedTestSuites[suiteIndex].completedTests[testIndex]
-      )
-    }
-  }
-
-  getCompletedTestSuites(): CompletedTestSuite[] {
-    return this.completedTestSuites
-  }
-
-  isTestRunning(): boolean {
-    return this.isRunning
-  }
-}

sasjs-tests/src/core/index.ts

@@ -1,3 +0,0 @@
-export * from './runTest'
-export * from './TestRunner'
-export * from './AppContext'

sasjs-tests/src/core/runTest.ts

@@ -1,30 +0,0 @@
-import type { Test, TestResult } from '../types'
-
-export async function runTest(
-  testToRun: Test,
-  context: unknown
-): Promise<TestResult> {
-  const { test, assertion, beforeTest, afterTest } = testToRun
-  const beforeTestFunction = beforeTest ? beforeTest : () => Promise.resolve()
-  const afterTestFunction = afterTest ? afterTest : () => Promise.resolve()
-
-  const startTime = new Date().valueOf()
-
-  return beforeTestFunction()
-    .then(() => test(context))
-    .then((res) => {
-      return Promise.resolve(assertion(res, context))
-    })
-    .then((testResult) => {
-      afterTestFunction()
-      const endTime = new Date().valueOf()
-      const executionTime = (endTime - startTime) / 1000
-      return { result: testResult, error: null, executionTime }
-    })
-    .catch((e) => {
-      console.error(e)
-      const endTime = new Date().valueOf()
-      const executionTime = (endTime - startTime) / 1000
-      return { result: false, error: e, executionTime }
-    })
-}

sasjs-tests/src/index.scss

@@ -0,0 +1,61 @@
+body {
+  margin: 0;
+  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans",
+    "Droid Sans", "Helvetica Neue", sans-serif;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  background-color: #1f2027;
+  color: #eee;
+}
+
+* {
+  font-family: source-code-pro, Menlo, Monaco, Consolas, "Courier New", monospace;
+}
+
+input {
+  padding: 8px;
+  border-radius: 3px;
+  border: none;
+  font-size: 1.125em;
+}
+
+.submit-button {
+  border: none;
+  border-radius: 3px;
+  padding: 8px;
+  background-color: #f9e804;
+  color: black;
+  font-size: 0.8em;
+
+  &.disabled {
+    pointer-events: none;
+  }
+}
+
+.row {
+  display: flex;
+  flex-direction: column;
+  margin-top: 16px;
+}
+
+.loading-spinner {
+  display: inline-block;
+  width: 50px;
+  height: 50px;
+  border: 3px solid rgba(255, 255, 255, 0.3);
+  border-radius: 50%;
+  border-top-color: #fff;
+  animation: spin 1s ease-in-out infinite;
+  -webkit-animation: spin 1s ease-in-out infinite;
+}
+
+@keyframes spin {
+  to {
+    -webkit-transform: rotate(360deg);
+  }
+}
+@-webkit-keyframes spin {
+  to {
+    -webkit-transform: rotate(360deg);
+  }
+}

sasjs-tests/src/index.tsx

@@ -0,0 +1,26 @@
+import React from 'react'
+import ReactDOM from 'react-dom'
+import { Route, HashRouter, Switch } from 'react-router-dom'
+import './index.scss'
+import * as serviceWorker from './serviceWorker'
+import { AppProvider } from '@sasjs/test-framework'
+import PrivateRoute from './PrivateRoute'
+import Login from './Login'
+import App from './App'
+
+ReactDOM.render(
+  <AppProvider>
+    <HashRouter>
+      <Switch>
+        <PrivateRoute exact path="/" component={App} />
+        <Route exact path="/login" component={Login} />
+      </Switch>
+    </HashRouter>
+  </AppProvider>,
+  document.getElementById('root')
+)
+
+// If you want your app to work offline and load faster, you can change
+// unregister() to register() below. Note this comes with some pitfalls.
+// Learn more about service workers: https://bit.ly/CRA-PWA
+serviceWorker.unregister()

sasjs-tests/src/main.ts

@@ -1,142 +0,0 @@
-import * as SASjsModule from '@sasjs/adapter'
-const SASjsImport = (SASjsModule as any).default || SASjsModule
-const SASjs = SASjsImport.default
-
-import { appContext } from './core/AppContext'
-import { type ConfigWithCredentials, loadConfig } from './config/loader'
-import type { TestSuite } from './types'
-
-// Import custom elements (this registers them)
-import './components/LoginForm'
-import './components/TestCard'
-import './components/TestSuite'
-import './components/TestsView'
-import './components/RequestsModal'
-import type { LoginForm } from './components/LoginForm'
-import type { TestsView } from './components/TestsView'
-import type { RequestsModal } from './components/RequestsModal'
-
-// Import test suites
-// import { basicTests } from './testSuites/Basic'
-import { sendArrTests, sendObjTests } from './testSuites/RequestData'
-import { fileUploadTests } from './testSuites/FileUpload'
-import { computeTests } from './testSuites/Compute'
-import { sasjsRequestTests } from './testSuites/SasjsRequests'
-import { viyaFileTests } from './testSuites/ViyaFile'
-
-async function init() {
-  const appContainer = document.getElementById('app')
-  if (!appContainer) {
-    console.error('App container not found')
-    return
-  }
-
-  try {
-    // Load config
-    const config = await loadConfig()
-
-    // Initialize adapter
-    const adapter = new SASjs(config.sasJsConfig)
-    appContext.setAdapter(adapter)
-    appContext.setConfig(config)
-
-    // Check session
-    try {
-      const sessionResponse = await adapter.checkSession()
-      if (sessionResponse && sessionResponse.isLoggedIn) {
-        appContext.setIsLoggedIn(true)
-        showTests(appContainer, adapter, config)
-        return
-      }
-    } catch {
-      console.log('No active session, showing login')
-    }
-
-    // Show login
-    showLogin(appContainer)
-  } catch (error) {
-    console.error('Failed to initialize app:', error)
-    appContainer.innerHTML = `
-      <div class="app__error">
-        <h1>Initialization Error</h1>
-        <p>Failed to load configuration. Please check config.json file.</p>
-        <pre>${error}</pre>
-      </div>
-    `
-  }
-}
-
-function showLogin(container: HTMLElement) {
-  container.innerHTML = ''
-  const loginForm = document.createElement('login-form') as LoginForm
-
-  loginForm.addEventListener('login-success', () => {
-    const adapter = appContext.getAdapter()
-    const config = appContext.getConfig()
-    if (adapter && config) {
-      showTests(container, adapter, config)
-    }
-  })
-
-  container.appendChild(loginForm)
-}
-
-function showTests(
-  container: HTMLElement,
-  adapter: typeof SASjs,
-  config: ConfigWithCredentials
-) {
-  const configTyped = config as {
-    sasJsConfig: { appLoc: string }
-    userName?: string
-    password?: string
-  }
-  const appLoc = configTyped.sasJsConfig.appLoc
-
-  // Build test suites with adapter and credentials
-  const testSuites: TestSuite[] = [
-    // FIXME: disabled basicTests due to login/logout operations
-    // basicTests(adapter, configTyped.userName || '', configTyped.password || ''),
-    sendArrTests(adapter, appLoc),
-    sendObjTests(adapter),
-    // specialCaseTests(adapter),
-    sasjsRequestTests(adapter),
-    fileUploadTests(adapter)
-  ]
-
-  // Add certain tests for SASVIYA only
-  if (adapter.getSasjsConfig().serverType === 'SASVIYA') {
-    testSuites.push(computeTests(adapter, appLoc))
-    testSuites.push(viyaFileTests(adapter, appLoc))
-  }
-
-  container.innerHTML = ''
-  const testsView = document.createElement('tests-view') as TestsView
-  testsView.testSuites = testSuites
-
-  const requestsModal = document.createElement(
-    'requests-modal'
-  ) as RequestsModal
-
-  testsView.addEventListener('logout', () => {
-    showLogin(container)
-  })
-
-  container.appendChild(requestsModal)
-  container.appendChild(testsView)
-}
-
-// Subscribe to auth changes
-appContext.subscribe((state) => {
-  const appContainer = document.getElementById('app')
-  if (!appContainer) return
-
-  if (!state.isLoggedIn) {
-    showLogin(appContainer)
-  } else if (state.adapter && state.config) {
-    showTests(appContainer, state.adapter, state.config)
-  }
-})
-
-// Initialize app
-init()

sasjs-tests/src/react-app-env.d.ts

@@ -0,0 +1 @@
+/// <reference types="react-scripts" />

sasjs-tests/src/serviceWorker.js

@@ -0,0 +1,141 @@
+// This optional code is used to register a service worker.
+// register() is not called by default.
+
+// This lets the app load faster on subsequent visits in production, and gives
+// it offline capabilities. However, it also means that developers (and users)
+// will only see deployed updates on subsequent visits to a page, after all the
+// existing tabs open on the page have been closed, since previously cached
+// resources are updated in the background.
+
+// To learn more about the benefits of this model and instructions on how to
+// opt-in, read https://bit.ly/CRA-PWA
+
+const isLocalhost = Boolean(
+  window.location.hostname === 'localhost' ||
+    // [::1] is the IPv6 localhost address.
+    window.location.hostname === '[::1]' ||
+    // 127.0.0.0/8 are considered localhost for IPv4.
+    window.location.hostname.match(
+      /^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/
+    )
+)
+
+export function register(config) {
+  if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {
+    // The URL constructor is available in all browsers that support SW.
+    const publicUrl = new URL(process.env.PUBLIC_URL, window.location.href)
+    if (publicUrl.origin !== window.location.origin) {
+      // Our service worker won't work if PUBLIC_URL is on a different origin
+      // from what our page is served on. This might happen if a CDN is used to
+      // serve assets; see https://github.com/facebook/create-react-app/issues/2374
+      return
+    }
+
+    window.addEventListener('load', () => {
+      const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`
+
+      if (isLocalhost) {
+        // This is running on localhost. Let's check if a service worker still exists or not.
+        checkValidServiceWorker(swUrl, config)
+
+        // Add some additional logging to localhost, pointing developers to the
+        // service worker/PWA documentation.
+        navigator.serviceWorker.ready.then(() => {
+          console.log(
+            'This web app is being served cache-first by a service ' +
+              'worker. To learn more, visit https://bit.ly/CRA-PWA'
+          )
+        })
+      } else {
+        // Is not localhost. Just register service worker
+        registerValidSW(swUrl, config)
+      }
+    })
+  }
+}
+
+function registerValidSW(swUrl, config) {
+  navigator.serviceWorker
+    .register(swUrl)
+    .then((registration) => {
+      registration.onupdatefound = () => {
+        const installingWorker = registration.installing
+        if (installingWorker == null) {
+          return
+        }
+        installingWorker.onstatechange = () => {
+          if (installingWorker.state === 'installed') {
+            if (navigator.serviceWorker.controller) {
+              // At this point, the updated precached content has been fetched,
+              // but the previous service worker will still serve the older
+              // content until all client tabs are closed.
+              console.log(
+                'New content is available and will be used when all ' +
+                  'tabs for this page are closed. See https://bit.ly/CRA-PWA.'
+              )
+
+              // Execute callback
+              if (config && config.onUpdate) {
+                config.onUpdate(registration)
+              }
+            } else {
+              // At this point, everything has been precached.
+              // It's the perfect time to display a
+              // "Content is cached for offline use." message.
+              console.log('Content is cached for offline use.')
+
+              // Execute callback
+              if (config && config.onSuccess) {
+                config.onSuccess(registration)
+              }
+            }
+          }
+        }
+      }
+    })
+    .catch((error) => {
+      console.error('Error during service worker registration:', error)
+    })
+}
+
+function checkValidServiceWorker(swUrl, config) {
+  // Check if the service worker can be found. If it can't reload the page.
+  fetch(swUrl, {
+    headers: { 'Service-Worker': 'script' }
+  })
+    .then((response) => {
+      // Ensure service worker exists, and that we really are getting a JS file.
+      const contentType = response.headers.get('content-type')
+      if (
+        response.status === 404 ||
+        (contentType != null && contentType.indexOf('javascript') === -1)
+      ) {
+        // No service worker found. Probably a different app. Reload the page.
+        navigator.serviceWorker.ready.then((registration) => {
+          registration.unregister().then(() => {
+            window.location.reload()
+          })
+        })
+      } else {
+        // Service worker found. Proceed as normal.
+        registerValidSW(swUrl, config)
+      }
+    })
+    .catch(() => {
+      console.log(
+        'No internet connection found. App is running in offline mode.'
+      )
+    })
+}
+
+export function unregister() {
+  if ('serviceWorker' in navigator) {
+    navigator.serviceWorker.ready
+      .then((registration) => {
+        registration.unregister()
+      })
+      .catch((error) => {
+        console.error(error.message)
+      })
+  }
+}

sasjs-tests/src/setupTests.js

@@ -0,0 +1,5 @@
+// jest-dom adds custom jest matchers for asserting on DOM nodes.
+// allows you to do things like:
+// expect(element).toHaveTextContent(/react/i)
+// learn more: https://github.com/testing-library/jest-dom
+import '@testing-library/jest-dom/extend-expect'

sasjs-tests/src/testSuites/Basic.ts

@@ -1,8 +1,6 @@
-/* eslint-disable @typescript-eslint/no-unused-vars */
-/* eslint-disable @typescript-eslint/no-explicit-any */
 import SASjs, { LoginMechanism, SASjsConfig } from '@sasjs/adapter'
+import { TestSuite } from '@sasjs/test-framework'
 import { ServerType } from '@sasjs/utils/types'
-import type { TestSuite } from '../types'
 
 const stringData: any = { table1: [{ col1: 'first col value' }] }
 
@@ -63,7 +61,7 @@ export const basicTests = (
         'Should fail on first attempt and should log the user in on second attempt',
       test: async () => {
         await adapter.logOut()
-        await adapter.logIn('invalid', 'invalid').catch((_err: any) => {})
+        await adapter.logIn('invalid', 'invalid').catch((err: any) => {})
         return await adapter.logIn(userName, password)
       },
       assertion: (response: any) =>

sasjs-tests/src/testSuites/Compute.ts

@@ -1,6 +1,5 @@
-/* eslint-disable @typescript-eslint/no-explicit-any */
 import SASjs from '@sasjs/adapter'
-import type { TestSuite } from '../types'
+import { TestSuite } from '@sasjs/test-framework'
 
 const stringData: any = { table1: [{ col1: 'first col value' }] }
 
@@ -49,7 +48,7 @@ export const computeTests = (adapter: SASjs, appLoc: string): TestSuite => ({
       test: () => {
         const data: any = { table1: [{ col1: 'first col value' }] }
         return adapter.startComputeJob(
-          `${appLoc}/common/sendArr`,
+          '/Public/app/adapter-tests/services/common/sendArr',
           data,
           {},
           undefined,

sasjs-tests/src/testSuites/FileUpload.ts

@@ -1,7 +1,5 @@
-/* eslint-disable prefer-const */
-/* eslint-disable @typescript-eslint/no-explicit-any */
 import SASjs from '@sasjs/adapter'
-import type { TestSuite } from '../types'
+import { TestSuite } from '@sasjs/test-framework'
 
 export const fileUploadTests = (adapter: SASjs): TestSuite => ({
   name: 'File Upload Tests',

sasjs-tests/src/testSuites/RequestData.ts

@@ -1,6 +1,5 @@
-/* eslint-disable @typescript-eslint/no-explicit-any */
 import SASjs from '@sasjs/adapter'
-import type { TestSuite } from '../types'
+import { TestSuite } from '@sasjs/test-framework'
 
 const stringData: any = { table1: [{ col1: 'first col value' }] }
 const numericData: any = { table1: [{ col1: 3.14159265 }] }

sasjs-tests/src/testSuites/SasjsRequests.ts

@@ -1,6 +1,5 @@
-/* eslint-disable @typescript-eslint/no-explicit-any */
 import SASjs from '@sasjs/adapter'
-import type { TestSuite } from '../types'
+import { TestSuite } from '@sasjs/test-framework'
 
 const data: any = { table1: [{ col1: 'first col value' }] }
 

sasjs-tests/src/testSuites/SpecialCases.ts

@@ -1,7 +1,5 @@
-/* eslint-disable @typescript-eslint/no-unused-vars */
-/* eslint-disable @typescript-eslint/no-explicit-any */
 import SASjs from '@sasjs/adapter'
-import type { TestSuite } from '../types'
+import { TestSuite } from '@sasjs/test-framework'
 
 const specialCharData: any = {
   table1: [
@@ -327,7 +325,7 @@ export const specialCaseTests = (adapter: SASjs): TestSuite => ({
         // We receive formats in response. We compare it with formats that we included in request to make sure they are equal
         const resVars = res[`$${testTable}`].vars
 
-        Object.keys(resVars).forEach((key: any, _i: number) => {
+        Object.keys(resVars).forEach((key: any, i: number) => {
           let formatValue =
             testTableWithSpecialNumeric[`$${testTable}`].formats[
               key.toLowerCase()
@@ -375,7 +373,7 @@ export const specialCaseTests = (adapter: SASjs): TestSuite => ({
         // We receive formats in response. We compare it with formats that we included in request to make sure they are equal
         const resVars = res[`$${testTable}`].vars
 
-        Object.keys(resVars).forEach((key: any, _i: number) => {
+        Object.keys(resVars).forEach((key: any, i: number) => {
           let formatValue =
             testTableWithSpecialNumeric[`$${testTable}`].formats[
               key.toLowerCase()
@@ -423,7 +421,7 @@ export const specialCaseTests = (adapter: SASjs): TestSuite => ({
         // We receive formats in response. We compare it with formats that we included in request to make sure they are equal
         const resVars = res[`$${testTable}`].vars
 
-        Object.keys(resVars).forEach((key: any, _i: number) => {
+        Object.keys(resVars).forEach((key: any, i: number) => {
           let formatValue =
             testTableWithSpecialNumericLowercase[`$${testTable}`].formats[
               key.toLowerCase()
@@ -480,7 +478,7 @@ export const specialCaseTests = (adapter: SASjs): TestSuite => ({
         // We receive formats in response. We compare it with formats that we included in request to make sure they are equal
         const resVars = res[`$${testTable}`].vars
 
-        Object.keys(resVars).forEach((key: any, _i: number) => {
+        Object.keys(resVars).forEach((key: any, i: number) => {
           let formatValue =
             testTableWithSpecialNumeric[`$${testTable}`].formats[
               key.toLowerCase()

sasjs-tests/src/testSuites/ViyaFile.ts

@@ -1,31 +0,0 @@
-import SASjs from '@sasjs/adapter'
-import type { TestSuite } from '../types'
-
-export const viyaFileTests = (adapter: SASjs, appLoc: string): TestSuite => ({
-  name: 'SAS Viya File Tests',
-  tests: [
-    {
-      title: 'Create html file',
-      description: 'Should create an html file with appropriate properties',
-      test: async () => {
-        const fileContentBuffer = Buffer.from(
-          `<html>` +
-            `  <head><title>Test</title></head>` +
-            `  <body><p>This is a test</p></body>` +
-            `</html>`
-        )
-        // generate a timestamp string formatted as YYYYmmDDTHHMMSS_999
-        const timeMark = new Date()
-          .toISOString()
-          .replace(/(\/|:|\s|-|Z)/g, '')
-          .replace(/\./g, '_')
-        const filename = `viya_createFile_test_${timeMark}.html`
-        return adapter.createFile(filename, fileContentBuffer, appLoc)
-      },
-      assertion: () => {
-        //A test that returns a boolean
-        return true // dummy
-      }
-    }
-  ]
-})

sasjs-tests/src/types/context.ts

@@ -1,12 +0,0 @@
-import type SASjs from '@sasjs/adapter'
-import type { SASjsConfig } from '@sasjs/adapter'
-
-export interface AppConfig {
-  sasJsConfig: SASjsConfig
-}
-
-export interface AppState {
-  config: AppConfig | null
-  adapter: SASjs | null
-  isLoggedIn: boolean
-}

sasjs-tests/src/types/index.ts

@@ -1,2 +0,0 @@
-export * from './test'
-export * from './context'

sasjs-tests/src/types/test.ts

@@ -1,24 +0,0 @@
-/* eslint-disable @typescript-eslint/no-explicit-any */
-export interface Test {
-  title: string
-  description: string
-  beforeTest?: (...args: any) => Promise<any>
-  afterTest?: (...args: any) => Promise<any>
-  test: (context: any) => Promise<any>
-  assertion: (...args: any) => boolean
-}
-
-export interface TestSuite {
-  name: string
-  tests: Test[]
-  beforeAll?: (...args: any) => Promise<any>
-  afterAll?: (...args: any) => Promise<any>
-}
-
-export interface TestResult {
-  result: boolean
-  error: Error | null
-  executionTime: number
-}
-
-export type TestStatus = 'pending' | 'running' | 'passed' | 'failed'

sasjs-tests/src/utils/Assert.ts

@@ -0,0 +1,22 @@
+export const assert = (
+  expression: boolean | (() => boolean),
+  message = 'Assertion failed'
+) => {
+  let result
+  try {
+    if (typeof expression === 'boolean') {
+      result = expression
+    } else {
+      result = expression()
+    }
+  } catch (e: any) {
+    console.error(message)
+    throw new Error(message)
+  }
+  if (!!result) {
+    return
+  } else {
+    console.error(message)
+    throw new Error(message)
+  }
+}

sasjs-tests/tsconfig.json

@@ -1,26 +1,28 @@
 {
   "compilerOptions": {
-    "target": "ES2022",
+    "target": "es5",
-    "useDefineForClassFields": true,
+    "lib": [
-    "module": "ESNext",
+      "dom",
-    "lib": ["ES2022", "DOM", "DOM.Iterable"],
+      "dom.iterable",
-    "types": ["vite/client"],
+      "esnext"
+    ],
+    "sourceMap": true,
+    "inlineSources": true,
+    "allowJs": true,
     "skipLibCheck": true,
-
+    "esModuleInterop": true,
-    /* Bundler mode */
+    "allowSyntheticDefaultImports": true,
-    "moduleResolution": "bundler",
-    "allowImportingTsExtensions": true,
-    "verbatimModuleSyntax": true,
-    "moduleDetection": "force",
-    "noEmit": true,
-
-    /* Linting */
     "strict": true,
-    "noUnusedLocals": true,
+    "forceConsistentCasingInFileNames": true,
-    "noUnusedParameters": true,
+    "module": "esnext",
-    "erasableSyntaxOnly": true,
+    "moduleResolution": "node",
-    "noFallthroughCasesInSwitch": true,
+    "resolveJsonModule": true,
-    "noUncheckedSideEffectImports": true
+    "isolatedModules": true,
+    "noEmit": true,
+    "jsx": "react-jsx",
+    "noFallthroughCasesInSwitch": true
   },
-  "include": ["src"]
+  "include": [
+    "src"
+  ]
 }

sasjs-tests/vite.config.js

@@ -1,8 +0,0 @@
-import { defineConfig } from 'vite'
-export default defineConfig({
-  build: {
-    assetsInlineLimit: 0,
-    assetsDir: ''
-  },
-  base: ''
-})

src/SASViyaApiClient.ts

@@ -36,59 +36,6 @@ interface JobExecutionResult {
   error?: object
 }
 
-interface IViyaTypesResponse {
-  accept: string
-  count: number
-  items: IViyaTypesItem[]
-  limit: number
-  links: IViyaTypesLink[]
-  name: string
-  start: number
-  version: number
-}
-
-interface IViyaTypesItem {
-  description?: string
-  extensions?: string[]
-  iconUri?: string
-  label: string
-  links: IViyaTypesLink[]
-  mappedTypes?: string[]
-  mediaType?: string
-  mediaTypes?: string[]
-  name: string
-  pluralLabel?: string
-  properties?: IViyaTypesProperties
-  resourceUri?: string
-  serviceRootUri?: string
-  tags?: string[]
-  version: number
-}
-
-/**
- * Generic structure for a link
- * in the links array of a Viya
- * types/types api response
- */
-type IViyaTypesLink = Record<string, string>
-
-/**
- * Generic structure for a type's
- * 'properties' object from the Viya
- * types/types api response
- */
-type IViyaTypesProperties = Record<string, string>
-
-/**
- * Arbitrary interface for storing
- * sufficient additional detail to
- * create and patch a new file.
- */
-interface IViyaTypesExtensionInfo {
-  typeDefName: string
-  properties: IViyaTypesProperties | undefined
-}
-
 /**
  * A client for interfacing with the SAS Viya REST API.
  *
@@ -115,9 +62,6 @@ export class SASViyaApiClient {
   )
   private folderMap = new Map<string, Job[]>()
 
-  private fileExtensionMap = new Map<string, IViyaTypesExtensionInfo>()
-  private boolExtensionMap = false // has the fileExtensionMap been populated yet?
-
   /**
    * A helper method used to call appendRequest method of RequestClient
    * @param response - response from sasjs request
@@ -490,89 +434,14 @@ export class SASViyaApiClient {
     const formData = new NodeFormData()
     formData.append('file', contentBuffer, fileName)
 
-    /** Query Viya for file metadata based on extension type.
-     *  Without providing certain properties, some versions of Viya will not
-     *  serve files as intended. Avoid this issue by applying the properties
-     *  that Viya has registered for a file extension.
-     */
-
-    // typeDefName - Viya should automatically determine this and additional
-    // properties at runtime if not provided in the file creation request.
-    let typeDefName: string | undefined = undefined
-    // Viya update 2025.09 resulted in a change to this automatic behaviour.
-    // We patch the new file to replicate the behaviour.
-    let filePatch:
-      | {
-          name: string
-          properties: IViyaTypesProperties | undefined
-        }
-      | undefined = undefined
-
-    // The patching process requires properties related to the file-extension
-    const fileExtension: string | undefined = fileName
-      .split('.')
-      .pop()
-      ?.toLowerCase()
-
-    if (fileExtension) {
-      if (!this.boolExtensionMap) {
-        // Populate the file extension map
-        // 1. Get Viya's response to this api call
-        const typesQueryUrl = `/types/types?limit=999999`
-        const response = (
-          await this.requestClient.get(typesQueryUrl, accessToken)
-        ).result as IViyaTypesResponse
-        // 2. Filter the returned items that have file extensions into a map
-        //    using forEach as an item may relate to multiple file extensions.
-        response.items
-          .filter((e) => e.extensions)
-          .forEach((e) => {
-            e.extensions?.forEach((ext) => {
-              this.fileExtensionMap.set(ext, {
-                typeDefName: e.name, // "name:" is the typeDefName value required for file creation.
-                properties: e.properties
-              })
-            })
-          })
-        // 3. Toggle the flag to avoid repeating this step
-        this.boolExtensionMap = true
-      }
-
-      const fileExtInfo = this.fileExtensionMap.get(fileExtension)
-      if (fileExtInfo) {
-        typeDefName = fileExtInfo.typeDefName
-        if (fileExtInfo.properties)
-          filePatch = { name: fileName, properties: fileExtInfo.properties }
-      }
-    }
-
     return (
-      await this.requestClient
+      await this.requestClient.post<File>(
-        .post<File>(
+        `/files/files?parentFolderUri=${parentFolderUri}&typeDefName=file#rawUpload`,
-          `/files/files?parentFolderUri=${parentFolderUri}&typeDefName=${
+        formData,
-            typeDefName ?? 'file'
+        accessToken,
-          }#rawUpload`,
+        'multipart/form-data; boundary=' + (formData as any)._boundary,
-          formData,
+        headers
-          accessToken,
+      )
-          'multipart/form-data; boundary=' + (formData as any)._boundary,
-          headers
-        )
-        .then(async (res) => {
-          // If a patch was created...
-          if (filePatch) {
-            // Get the URI of the newly created file
-            const fileUri = res.result.links.filter(
-              (e) => e.method == 'PATCH' && e.rel == 'patch'
-            )[0].uri
-            // and apply the patch
-            return await this.requestClient.patch<File>(
-              `${fileUri}`,
-              filePatch,
-              accessToken
-            )
-          }
-          return res
-        })
     ).result
   }