Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

testplane does not support ESM configuration files and .ts extension for test files #1050

Open
1 task
BlackPoretsky opened this issue Jan 6, 2025 · 2 comments

Comments

@BlackPoretsky
Copy link

BlackPoretsky commented Jan 6, 2025

Verify latest release

  • I verified that the issue exists in the latest Hermione release

Hermione version

8.23.1

Last Hermione version that worked

No response

Which area(s) of Hermione are affected? (leave empty if unsure)

No response

Link to the code that reproduces this issue or a replay of the bug

No response

Reproduction steps

  1. Create a configuration file for Testplane with the html-reporter plugin. (npm init testplane -- -v with pnpm)
    Configuration:
import type { ConfigInput } from 'testplane';

export default {
  baseUrl: 'http://localhost',
  browsers: {
    chrome: {
      automationProtocol: 'devtools',
      desiredCapabilities: {
        browserName: 'chrome'
      },
      headless: true
    }
  },
  gridUrl: 'http://localhost:4444/wd/hub',
  httpTimeout: 60000,
  pageLoadTimeout: 0,
  plugins: {
    '@testplane/storybook': {
      autoScreenshots: true,
      // https://github.com/gemini-testing/hermione-storybook
      // To run hermione storybook tests, use --storybook flag when launching hermione
      // And dont forget to set 'buildStoriesJson: true' in storybook config if you use storybook@6
      enabled: true,
      localport: 6006,
      storybookConfigDir: '.storybook'
    },
    '@testplane/test-filter': {
      // https://github.com/gemini-testing/testplane-test-filter
      enabled: true,
      inputFile: 'testplane-filter.json'
      // Create a file testplane-filter.json
      // With the following structure:
      // [
      //     {
      //         \"fullTitle\": \"some-title\",
      //         \"browserId\": \"some-browser\"
      //     }
      // ]
    },
    '@testplane/url-decorator': {
      // https://github.com/gemini-testing/testplane-url-decorator
      enabled: true,
      url: {
        query: {
          // Write your entries like \"text\": \"ololo\" to add query param &text=ololo
          // You can also specify \"mode\": \"override\", if you need to overwrite existing param
        }
      }
    },
    'html-reporter/testplane': {
      defaultView: 'all',
      diffMode: '3-up-scaled',
      // https://github.com/gemini-testing/html-reporter
      enabled: true,
      path: 'testplane-report'
    }
  },
  resetCursor: false,
  sets: {
    desktop: {
      browsers: ['chrome'],
      files: ['**/tests/*.testplane.(t|j)s']
    }
  },
  testTimeout: 90000
} satisfies ConfigInput;
  1. Install the Testplane extension for VS Code.
  2. Open the Testplane extension.

Actual Behavior

When opening the extension, the following error message appears in the OUTPUT tab:

[WORKER 01:35:06] [01:35:06 +0300] Unable to read config from path e:\WEB_LEARN\SinsSoftware\Flippo\flippo-frontend\testplane.config.ts

[ERROR 01:35:06] Error: Testplane failed to start: 
Error [ERR_REQUIRE_ESM]: Must use import to load ES Module: e:\WEB_LEARN\SinsSoftware\Flippo\flippo-frontend\testplane.config.ts
require() of ES modules is not supported.
require() of e:\WEB_LEARN\SinsSoftware\Flippo\flippo-frontend\testplane.config.ts from E:\WEB_LEARN\SinsSoftware\Flippo\flippo-frontend\node_modules\.pnpm\[email protected]_@[email protected]_@[email protected][email protected]_@type_2uf5nugpmtuodxde2bpdmktqoy\node_modules\testplane\build\src\config\index.js is an ES module file as it is a .ts file whose nearest parent package.json contains "type": "module" which defines all .ts files in that package scope as ES modules.
Instead change the requiring code to use import(), or remove "type": "module" from e:\WEB_LEARN\SinsSoftware\Flippo\flippo-frontend\package.json.

Even when running via npx testplane instead of using the VS Code extension, the same error occurs.

After replacing the configuration file extension with .cts and using module.exports = {} syntax, the following issue occurs:

  • The html-reporter plugin creates a folder with the necessary files (e.g., database and other artifacts).
  • However, the .ts test files (e.g., example.testplane.ts) are not recognized, resulting in the following error:
[ERROR 03:35:26] TypeError: Unknown file extension ".ts" for E:\WEB_LEARN\SinsSoftware\Flippo\flippo-frontend\src\tests\example.testplane.ts
    at Object.getFileProtocolModuleFormat [as file:] (node:internal/modules/esm/get_format:160:9)
    at defaultGetFormat (node:internal/modules/esm/get_format:203:36)
    at defaultLoad (node:internal/modules/esm/load:141:22)
    at async ModuleLoader.load (node:internal/modules/esm/loader:409:7)
    at async ModuleLoader.moduleProvider (node:internal/modules/esm/loader:291:45)
    at async link (node:internal/modules/esm/module_job:76:21)

Expected Behavior

The expected behavior aligns with the example provided in the Testplane blog:
testing-sidebar-f3c667ae110b1c90f9c5c7f2a5ab70d0

Which Node.js version are you using?

20.10.0

@BlackPoretsky BlackPoretsky changed the title vscode-testplane does not support ESM configuration files and .ts extension for test files testplane does not support ESM configuration files and .ts extension for test files Jan 6, 2025
@BlackPoretsky
Copy link
Author

It seems the issue lies in the Config class, specifically in the read method, where require() is used, causing a conflict with ESM.

const configModule = require(path.resolve(process.cwd(), configPath));

To be honest, I don’t quite understand why import is used at the top of the file, while require is used for dynamic imports. Why not use import("path") instead? If require is necessary, perhaps it should be done using import { createRequire } from "module";.

@DudaGod
Copy link
Member

DudaGod commented Jan 9, 2025

Hello. We will fully support ESM in next major version - #854.

Thank you for your investigation.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants