@enact/ui-test-utils 1.0.9 → 2.0.0-alpha.1

package/.travis.yml

@@ -1,7 +1,7 @@
-dist: focal
+dist: jammy
 language: node_js
 node_js:
-    - node
+    - 21
 before_install:
     - sudo apt-get update
     - sudo apt-get install build-essential libcairo2-dev libpango1.0-dev libjpeg-dev libgif-dev librsvg2-dev

package/CHANGELOG.md

@@ -1,8 +1,17 @@
 # Change Log
 
+## [2.0.0-alpha.1] (February 26, 2025)
+
+* Updated `eslint` to v9 and adopted flat config.
+* Added `--no-animation` option for screenshot test.
+
+## [1.0.10] (October 31, 2024)
+
+* Updated dependencies.
+
 ## [1.0.9] (July 22, 2024)
 
-* Updated Chrome driver url for version 114 or higher
+* Updated Chrome driver url for version 114 or higher.
 
 ## [1.0.8] (June 11, 2024)
 

package/README.md

@@ -15,7 +15,7 @@ and must be configured as a `devDependency` of the UI library.
     * `wdio.docker.conf.js` containing `module.exports = require('@enact/ui-test-utils/ui/wdio.docker.conf.js');`
     * `wdio.tv.conf.js` containing `module.exports = require('@enact/ui-test-utils/ui/wdio.tv.conf.js');`
 
-and `tests/screenshot`
+* and `tests/screenshot`
 
     * `wdio.conf.js` containing `module.exports = require('@enact/ui-test-utils/screenshot/wdio.conf.js');`
     * `wdio.docker.conf.js` containing `module.exports = require('@enact/ui-test-utils/screenshot/wdio.docker.conf.js');`
@@ -35,7 +35,7 @@ and `tests/screenshot`
    }
 ```
 
-6. Optionally configure different ESLint and git configuration rules using `.eslintrc.js` and
+6. Optionally configure different ESLint and git configuration rules using `eslint.config.js` and
    `.gitignore` files, respectively
 
 ## Creating tests
@@ -60,16 +60,16 @@ TV_IP=10.0.1.1 npm run test-ui-tv
 npm run test-ui -- --spec <pattern>
 ```
 
-Example 1 -  will execute tests for 'ExpandableInput'
+Example 1 -  will execute tests for 'Button'
 
 ```bash
-npm run test-ui -- --spec ExpandableInput
+npm run test-ui -- --spec Button
 ```
 
-Example 2 - will execute tests for 'Input' component
+Example 2 - will execute tests for 'InputField' component
 
 ```bash
-npm run test-ui -- --spec /Input
+npm run test-ui -- --spec /InputField
 ```
 
 Note: `<pattern>` can also be a regex and may need to be in quotes to prevent expansion on the command
@@ -98,13 +98,13 @@ npm run test-ss -- --component Button
 ### Filtering Screenshot by Theme
 
 ```bash
-npm run test-ss -- --spec MoonstoneLight-specs
+npm run test-ss -- --spec Light-specs
 ```
 
 You can combine theme and component filtering for more precise runs:
 
 ```bash
-npm run test-ss -- --component CheckboxItem --spec Moonstone-specs
+npm run test-ss -- --component CheckboxItem --spec Default-specs
 ```
 
 ### Filtering Screenshot by Title
@@ -165,7 +165,7 @@ open tests/screenshot/dist/failedTests.html
 
 Images can be navigated using the keyboard arrow keys. Click on an image to zoom in.  Click out of the image to zoom out.
 
-In the output, the **test case** button opens the sample app with the parameters that produced the output. This requires that a server be running on port 5000. If you have globally installed the `serve` command with `npm install -g serve` you can start the server like this:
+In the output, the **test case** button opens the sample app with the parameters that produced the output. This requires that a server be running on port 3000. If you have globally installed the `serve` command with `npm install -g serve` you can start the server like this:
 
 ```bash
 serve tests/screenshot/dist
@@ -182,16 +182,6 @@ the Enact version or test apps will not be picked up.
 npm run test-ui -- --spec /Input --skip-build
 ```
 
-### Re-pack the apps without running the tests
-
-To re-pack just the tests, without rebuilding Enact or running the tests, use `--pack-tests`. This
-is primarily useful when using `serve dist` (See **Loading sample apps in a browser** below) to view
-test apps in the browser.
-
-```bash
-npm run test-ui -- --pack-tests
-```
-
 ## Advanced Usage
 
 ### Setting the Number of Concurrent Instances
@@ -228,9 +218,18 @@ For example, filtering for the component 'Input'.
 npm run test-ui -- --visible --spec /Input
 ```
 
+### Running without animation effects
+
+The `--no-animation` option is used to pack Enact without animation.
+You can use this option to test the apps without animation effects.
+
+```bash
+npm run test-ss -- --no-animation
+```
+
 ### Loading sample apps in a browser
 
- This requires that a server be running on port 5000. If you have globally installed the `serve`
+ This requires that a server be running on port 3000. If you have globally installed the `serve`
  command with `npm install -g serve` you can start the server like this:
 
 ```bash
@@ -241,27 +240,27 @@ To open a specific test app, open the URL path for the test.  The path will matc
 source file for the app.  For example, to open the `VirtualList` test app, navigate to:
 
 ```none
-http://localhost:5000/VirtualList-View/
+http://localhost:3000/VirtualList-View/
 ```
 
 ### Viewing screenshot tests in the browser
 
-Navigate to a URL using the component name and test case number. Change 'Moonstone-View' to the name of the view appropriate for your library.
+Navigate to a URL using the component name and test case number. Change 'Sandstone-View' to the name of the view appropriate for your library.
 
 An index page will be served when no component is specified.  Select a test from the list to open it.
 
 ```none
-localhost:5000/Moonstone-View/
+localhost:3000/Sandstone-View/
 ```
 
 You can go directly to a test by specifying the component name and test ID number:
 
 ```none
-localhost:5000/Moonstone-View/?component=<component name>&testId=<number of the test>
+localhost:3000/Sandstone-View/?component=<component name>&testId=<number of the test>
 ```
 
 Example:
 
 ```none
-localhost:5000/Moonstone-View/?component=RadioItem&testId=10
+localhost:3000/Sandstone-View/?component=RadioItem&testId=10
 ```

package/config/wdio.conf.js

@@ -47,7 +47,7 @@ module.exports.configure = (options) => {
 					process.env.CHROME_DRIVER = chromeDriverVersion;
 				}
 			} catch (error) {
-				console.log('ERROR: Cannnot find Chrome driver from Chrome ' + chromeVersionMajorNumber);
+				console.log('ERROR: Cannot find Chrome driver from Chrome ' + chromeVersionMajorNumber);
 				process.env.CHROME_DRIVER = 2.44;
 			}
 		}
@@ -95,7 +95,7 @@ module.exports.configure = (options) => {
 			// First, you can define how many instances should be started at the same time. Let's
 			// say you have 3 different capabilities (Chrome, Firefox, and Safari) and you have
 			// set maxInstances to 1; wdio will spawn 3 processes. Therefore, if you have 10 spec
-			// files and you set maxInstances to 10, all spec files will get tested at the same time
+			// files, and you set maxInstances to 10, all spec files will get tested at the same time
 			// and 30 processes will get spawned. The property handles how many capabilities
 			// from the same test should run tests.
 			//
@@ -224,8 +224,6 @@ module.exports.configure = (options) => {
 			/**
 			 * Gets executed before test execution begins. At this point you can access to all global
 			 * variables like `browser`. It is the perfect place to define custom commands.
-			 * @param {Array.<Object>} capabilities list of capabilities details
-			 * @param {Array.<String>} specs List of spec file paths that are to be run
 			 */
 			before: function () {
 				require('expect-webdriverio');

package/eslint.config.js

@@ -0,0 +1,34 @@
+const enactStrict = require('eslint-config-enact/strict');
+const globals = require('globals');
+
+const customGlobals = {
+	'browser': true,
+	'expect': true,
+	'$': true,
+	'$$': true
+};
+
+module.exports = [
+	...enactStrict,
+	{
+		languageOptions: {
+			ecmaVersion: 'latest',
+			sourceType: 'module',
+			globals: {
+				...globals.node,
+				...globals.mocha,
+				...customGlobals
+			},
+			parserOptions: {
+				ecmaFeatures: {
+					jsx: true
+				}
+			}
+		},
+		rules: {
+			'max-nested-callbacks': 'off',
+			'no-console': 'off',
+			'react/forbid-foreign-prop-types': 'off' // proptypes not removed in storybook config
+		}
+	}
+];