add cypress smoketest for scaffolded static crs...

Author: NiloCK

packages/cli/cypress.config.js

@@ -0,0 +1,17 @@
+import { defineConfig } from 'cypress';
+
+export default defineConfig({
+  e2e: {
+    baseUrl: 'http://localhost:5173', // Default Vite dev server port
+    supportFile: 'cypress/support/e2e.js',
+    specPattern: 'cypress/e2e/**/*.cy.{js,jsx,ts,tsx}',
+    setupNodeEvents(on, config) {
+      // implement node event listeners here
+    },
+  },
+  // Increase the default timeout for slower operations
+  defaultCommandTimeout: 10000,
+  // Viewport configuration
+  viewportWidth: 1280,
+  viewportHeight: 800,
+});

packages/cli/cypress/e2e/scaffolded-app.cy.js

@@ -0,0 +1,32 @@
+// Test for CLI scaffolded application
+describe('CLI Scaffolded App - Study View', () => {
+  it('should navigate to /study and render a card', () => {
+    // Visit the study page
+    cy.visit('/study');
+
+    // Wait for the application to load and render
+    // Check for the presence of a card view
+    // The cardView class is present on all rendered cards
+    cy.get('.cardView', { timeout: 15000 })
+      .should('exist')
+      .and('be.visible');
+
+    // Additional validation: check that the card has a viewable data attribute
+    // This indicates it's a properly rendered card component
+    cy.get('[data-viewable]', { timeout: 15000 })
+      .should('exist')
+      .and('be.visible');
+
+    // Verify that the card container (v-card) is present
+    cy.get('.v-card', { timeout: 15000 })
+      .should('exist')
+      .and('be.visible');
+  });
+
+  it('should load the home page successfully', () => {
+    cy.visit('/');
+
+    // Verify basic page load
+    cy.get('body').should('be.visible');
+  });
+});

packages/cli/cypress/support/commands.js

@@ -0,0 +1,9 @@
+// ***********************************************
+// This example commands.js shows you how to
+// create various custom commands and overwrite
+// existing commands.
+//
+// For more comprehensive examples of custom
+// commands please read more here:
+// https://on.cypress.io/custom-commands
+// ***********************************************

packages/cli/cypress/support/e2e.js

@@ -0,0 +1,17 @@
+// ***********************************************************
+// This example support/e2e.js is processed and
+// loaded automatically before your test files.
+//
+// This is a great place to put global configuration and
+// behavior that modifies Cypress.
+//
+// You can change the location of this file or turn off
+// automatically serving support files with the
+// 'supportFile' configuration option.
+//
+// You can read more here:
+// https://on.cypress.io/configuration
+// ***********************************************************
+
+// Import commands.js using ES2015 syntax:
+import './commands';

packages/cli/package.json

@@ -26,7 +26,9 @@
     "lint": "npx eslint .",
     "lint:fix": "npx eslint . --fix",
     "lint:check": "npx eslint . --max-warnings 0",
-    "try:init": "node dist/cli.js init testproject --dangerously-clobber --no-interactive --data-layer static --import-course-data --import-server-url http://localhost:5984 --import-username admin --import-password password --import-course-ids 2aeb8315ef78f3e89ca386992d00825b && cd testproject && npm i && npm install --save-dev @vue-skuilder/cli@file:.. && npm install @vue-skuilder/db@file:../../db @vue-skuilder/courseware@file:../../courseware @vue-skuilder/common-ui@file:../../common-ui @vue-skuilder/express@file:../../express"
+    "try:init": "node dist/cli.js init testproject --dangerously-clobber --no-interactive --data-layer static --import-course-data --import-server-url http://localhost:5984 --import-username admin --import-password password --import-course-ids 2aeb8315ef78f3e89ca386992d00825b && cd testproject && npm i && npm install --save-dev @vue-skuilder/cli@file:.. && npm install @vue-skuilder/db@file:../../db @vue-skuilder/courseware@file:../../courseware @vue-skuilder/common-ui@file:../../common-ui @vue-skuilder/express@file:../../express",
+    "test:e2e": "cypress open",
+    "test:e2e:headless": "cypress run"
   },
   "keywords": [
     "cli",
@@ -64,9 +66,11 @@
     "@types/serve-static": "^1.15.0",
     "@vitejs/plugin-vue": "^5.2.1",
     "@vue-skuilder/studio-ui": "workspace:*",
+    "cypress": "14.1.0",
     "typescript": "~5.7.2",
     "vite": "^6.0.9",
-    "vue-tsc": "^1.8.0"
+    "vue-tsc": "^1.8.0",
+    "wait-on": "8.0.2"
   },
   "engines": {
     "node": ">=18.0.0"

yarn.lock

@@ -6502,6 +6502,7 @@ __metadata:
     "@vue-skuilder/studio-ui": "workspace:*"
     chalk: "npm:^5.3.0"
     commander: "npm:^11.0.0"
+    cypress: "npm:14.1.0"
     fs-extra: "npm:^11.2.0"
     inquirer: "npm:^9.2.0"
     leveldown: "npm:^6.1.1"
@@ -6514,6 +6515,7 @@ __metadata:
     vue-router: "npm:^4.2.0"
     vue-tsc: "npm:^1.8.0"
     vuetify: "npm:^3.7.0"
+    wait-on: "npm:8.0.2"
   bin:
     skuilder: ./dist/cli.js
   languageName: unknown