Refactored Jest demo test to use 'require()' instead of 'eval()'.

Author: AlexSkrypnyk

.eslintrc.json

@@ -66,7 +66,7 @@
       "files": ["*.test.js"],
       "env": { "jest": true },
       "rules": {
-        "no-eval": "off",
+        "global-require": "off",
         "max-nested-callbacks": ["warn", 5],
         "jsdoc/check-tag-names": "off"
       }

.vortex/docs/content/development/jest.mdx

@@ -14,24 +14,26 @@ For running tests, configuration, and CI settings, see the
 
 ## Test file structure
 
-Test files are co-located with source files in the `js/` directory of each
-custom module:
+Test files are placed in a `tests/` subdirectory within the `js/` directory of
+each custom module:
 
 ```text
 web/modules/custom/my_module/
 └── js/
-    ├── my_module.js          # Source file (Drupal behavior)
-    └── my_module.test.js     # Jest test file
+    ├── my_module.js           # Source file (Drupal behavior)
+    └── tests/
+        └── my_module.test.js  # Jest test file
 ```
 
 Jest automatically discovers `*.test.js` files in `web/modules/custom/*/js/`
-directories. Adding a new module with tests requires no configuration changes.
+directories and their subdirectories. Adding a new module with tests requires
+no configuration changes.
 
 ## Writing tests
 
 Drupal JavaScript uses the IIFE pattern `((Drupal) => { ... })(Drupal)` where
-`Drupal` is a global object. Tests load these source files using `eval()` after
-setting up the required globals.
+`Drupal` is a global object. Tests load these source files using `require()`
+after setting up the required globals.
 
 ### Test template
 
@@ -40,17 +42,14 @@ setting up the required globals.
  * @jest-environment jsdom
  */
 
-const fs = require('fs');
-const path = require('path');
-
 describe('Drupal.behaviors.myModule', () => {
   beforeEach(() => {
     localStorage.clear();
     global.Drupal = { behaviors: {} };
 
-    const filePath = path.resolve(__dirname, 'my_module.js');
-    const code = fs.readFileSync(filePath, 'utf8');
-    eval(code);
+    jest.resetModules();
+    // eslint-disable-next-line global-require
+    require('../my_module.js');
   });
 
   afterEach(() => {
@@ -69,9 +68,12 @@ describe('Drupal.behaviors.myModule', () => {
 
 ### Loading Drupal behaviors
 
-The `eval(fs.readFileSync(...))` pattern executes the source file's IIFE, which
-receives `global.Drupal` as its `Drupal` parameter and registers the behavior.
-After `eval()`, the behavior is accessible via `Drupal.behaviors.myModule`.
+The `require()` call executes the source file's IIFE, which receives
+`global.Drupal` as its `Drupal` parameter and registers the behavior.
+After `require()`, the behavior is accessible via `Drupal.behaviors.myModule`.
+
+The `jest.resetModules()` call before `require()` clears the module cache so
+the IIFE re-executes on each test with a fresh `global.Drupal` object.
 
 ### Mocking globals
 
@@ -121,12 +123,35 @@ jest.useRealTimers();
 ### ESLint compatibility
 
 The `.eslintrc.json` includes an override for `*.test.js` files that enables
-the `jest` environment and allows `eval()`. No additional ESLint configuration
-is needed for test files.
+the `jest` environment and allows `global-require`. No additional ESLint
+configuration is needed for test files.
+
+## Coverage
+
+Jest collects code coverage automatically when running tests via `ahoy test-js`.
+Coverage is configured in [`jest.config.js`](https://github.com/drevops/vortex/blob/main/jest.config.js)
+with the following settings:
+
+- **Source files**: all `*.js` files in `web/modules/custom/*/js/` directories,
+  excluding `*.test.js` files
+- **Reporters**: text (terminal summary), lcov, HTML, and Cobertura XML
+- **Output directory**: `.logs/coverage/jest`
+
+After running tests, coverage reports are available at:
+
+| Report | Location |
+|--------|----------|
+| Terminal summary | Printed to stdout during test run |
+| HTML report | `.logs/coverage/jest/lcov-report/index.html` |
+| LCOV data | `.logs/coverage/jest/lcov.info` |
+| Cobertura XML | `.logs/coverage/jest/cobertura.xml` |
+
+The Cobertura XML report is used by continuous integration to track coverage
+trends and can be consumed by CI tools that support the Cobertura format.
 
 ## Boilerplate
 
-**Vortex** provides a Jest test boilerplate for the [demo module](https://github.com/drevops/vortex/blob/main/web/modules/custom/ys_demo/js/ys_demo.test.js)
+**Vortex** provides a Jest test boilerplate for the [demo module](https://github.com/drevops/vortex/blob/main/web/modules/custom/ys_demo/js/tests/ys_demo.test.js)
 that demonstrates testing a counter block with DOM manipulation, localStorage
 interaction, and event handling.
 

.vortex/tests/phpunit/Traits/Subtests/SubtestAhoyTrait.php

@@ -536,12 +536,20 @@ protected function runAhoyTestPhpunit(string $type, string $file): void {
   protected function subtestAhoyTestJs(string $webroot = 'web'): void {
     $this->logStepStart();
 
-    $file = $webroot . '/modules/custom/sw_demo/js/sw_demo.test.js';
+    $file = $webroot . '/modules/custom/sw_demo/js/tests/sw_demo.test.js';
     $this->assertFileExists($file);
 
     $this->logSubstep('Run all Jest tests');
     $this->cmd('ahoy test-js', 'Tests:');
 
+    $this->logSubstep('Assert Jest coverage files are present');
+    $this->syncToHost('.logs');
+    $this->assertDirectoryExists('.logs/coverage/jest');
+    $this->assertFileExists('.logs/coverage/jest/cobertura.xml');
+    $this->assertDirectoryExists('.logs/coverage/jest/lcov-report');
+    $this->assertFileContainsString('.logs/coverage/jest/cobertura.xml', 'line-rate="1"');
+    $this->assertFileContainsString('.logs/coverage/jest/cobertura.xml', 'branch-rate="1"');
+
     $this->logSubstep('Run Jest tests matching a path pattern');
     $this->cmd('ahoy test-js -- --testPathPattern=sw_demo', 'Tests:');
 

…odules/custom/ys_demo/js/ys_demo.test.js …/custom/ys_demo/js/tests/ys_demo.test.jsweb/modules/custom/ys_demo/js/ys_demo.test.js renamed to web/modules/custom/ys_demo/js/tests/ys_demo.test.js web/modules/custom/ys_demo/js/ys_demo.test.js renamed to web/modules/custom/ys_demo/js/tests/ys_demo.test.js

@@ -2,21 +2,21 @@
  * @jest-environment jsdom
  */
 
-const fs = require('fs');
-const path = require('path');
-
 describe('Drupal.behaviors.ysDemo', () => {
   beforeEach(() => {
     localStorage.clear();
     global.Drupal = { behaviors: {} };
 
-    const filePath = path.resolve(__dirname, 'ys_demo.js');
-    const code = fs.readFileSync(filePath, 'utf8');
-    eval(code);
+    jest.spyOn(console, 'log').mockImplementation(() => {});
+
+    jest.resetModules();
+    // eslint-disable-next-line global-require
+    require('../ys_demo.js');
   });
 
   afterEach(() => {
     delete global.Drupal;
+    jest.restoreAllMocks();
   });
 
   function createCounterBlockHtml() {

web/modules/custom/ys_demo/js/ys_demo.js

@@ -51,8 +51,7 @@
             this.removeUpdatedClassAfterDelay(valueElement);
 
             // Log action for debugging.
-            // eslint-disable-next-line no-console
-            console.log(`Counter ${action}: ${currentValue}`);
+            this.log(`Counter ${action}: ${currentValue}`);
           });
         });
       });
@@ -97,5 +96,15 @@
     getCounterValue() {
       return parseInt(localStorage.getItem(this.storageKey), 10) || 0;
     },
+
+    /**
+     * Log a message to the console.
+     *
+     * @param {string} message  The message to log.
+     */
+    log(message) {
+      // eslint-disable-next-line no-console
+      console.log(message);
+    },
   };
 })(Drupal);