@grafana/create-plugin 7.9.2 → 7.10.1

package/CHANGELOG.md

@@ -1,5 +1,24 @@
 # Changelog
 
+## [7.10.1](https://github.com/grafana/plugin-tools/compare/@grafana/create-plugin@7.10.0...@grafana/create-plugin@7.10.1) (2026-08-27)
+
+
+### Bug Fixes
+
+* **create-plugin:** add @react-hookz/web + @ver0/deep-equal to Jest ESM ignore ([#2847](https://github.com/grafana/plugin-tools/issues/2847)) ([66068ab](https://github.com/grafana/plugin-tools/commit/66068abc145224767470902386949fd8b65f6eaa))
+
+## [7.10.0](https://github.com/grafana/plugin-tools/compare/@grafana/create-plugin@7.9.2...@grafana/create-plugin@7.10.0) (2026-08-21)
+
+
+### Features
+
+* **create-plugin:** make Playwright config extendable ([#2807](https://github.com/grafana/plugin-tools/issues/2807)) ([b7dd0fb](https://github.com/grafana/plugin-tools/commit/b7dd0fbf299e6a99bef04a1fc74e4f2c11a17a47))
+
+
+### Bug Fixes
+
+* **templates:** Update dependency @grafana/plugin-e2e to v3.11.0 ([#2825](https://github.com/grafana/plugin-tools/issues/2825)) ([d039033](https://github.com/grafana/plugin-tools/commit/d039033421febaa04a33d7dc2c039d5d761b9723))
+
 ## [7.9.2](https://github.com/grafana/plugin-tools/compare/@grafana/create-plugin@7.9.1...@grafana/create-plugin@7.9.2) (2026-08-05)
 
 

package/dist/codemods/migrations/migrations.js

@@ -72,6 +72,12 @@ var defaultMigrations = [
     version: "7.8.2",
     description: "Emit a single LICENSE.txt file for all licenses in bundled code.",
     scriptPath: import.meta.resolve("./scripts/012-terser-license-file.js")
+  },
+  {
+    name: "013-jest-esmodules",
+    version: "7.10.1",
+    description: "Support @grafana/ui@13.2.0 in Jest by transforming @react-hookz/web and @ver0/deep-equal ESM dependencies.",
+    scriptPath: import.meta.resolve("./scripts/013-jest-esmodules.js")
   }
   // Do not use LEGACY_UPDATE_CUTOFF_VERSION for new migrations. It is only used above to force migrations to run
   // for those written before the switch to updates as migrations.

package/dist/codemods/migrations/scripts/013-jest-esmodules.js

@@ -0,0 +1,65 @@
+import { join } from 'node:path';
+import * as recast from 'recast';
+import { migrationsDebug } from '../../utils.js';
+import { parseAsTypescript, findVariableDeclaration, printAST } from '../../utils.ast.js';
+
+const { builders } = recast.types;
+const JEST_UTILS_PATH = join(".config", "jest", "utils.js");
+const ESM_MODULES_TO_ADD = ["@react-hookz/web", "@ver0/deep-equal"];
+function migrate(context) {
+  if (!context.doesFileExist(JEST_UTILS_PATH)) {
+    migrationsDebug(`${JEST_UTILS_PATH} not found. Skipping Jest ESM modules migration.`);
+    return context;
+  }
+  const source = context.getFile(JEST_UTILS_PATH);
+  if (!source) {
+    migrationsDebug(`${JEST_UTILS_PATH} is empty. Skipping Jest ESM modules migration.`);
+    return context;
+  }
+  const parsed = parseAsTypescript(source);
+  if (!parsed.success) {
+    migrationsDebug(`Failed to parse ${JEST_UTILS_PATH}. Error: ${parsed.error.message}`);
+    return context;
+  }
+  const grafanaESModules = findVariableDeclaration(parsed.ast, "grafanaESModules");
+  if (!grafanaESModules) {
+    migrationsDebug(`Could not find grafanaESModules variable declaration in ${JEST_UTILS_PATH}`);
+    return context;
+  }
+  if (grafanaESModules.init?.type !== "ArrayExpression") {
+    migrationsDebug(`grafanaESModules variable in ${JEST_UTILS_PATH} is not an array.`);
+    return context;
+  }
+  const existingModules = new Set(
+    grafanaESModules.init.elements.map(getStringValue).filter((value) => value !== void 0)
+  );
+  const missingModules = ESM_MODULES_TO_ADD.filter((moduleName) => !existingModules.has(moduleName));
+  if (missingModules.length === 0) {
+    return context;
+  }
+  const schemaIndex = grafanaESModules.init.elements.findIndex(
+    (element) => getStringValue(element) === "@grafana/schema"
+  );
+  const insertIndex = schemaIndex === -1 ? grafanaESModules.init.elements.length : schemaIndex + 1;
+  grafanaESModules.init.elements.splice(
+    insertIndex,
+    0,
+    ...missingModules.map((moduleName) => builders.literal(moduleName))
+  );
+  context.updateFile(JEST_UTILS_PATH, printAST(parsed.ast));
+  return context;
+}
+function getStringValue(element) {
+  if (!element) {
+    return void 0;
+  }
+  if (element.type === "Literal" && typeof element.value === "string") {
+    return element.value;
+  }
+  if (element.type === "StringLiteral") {
+    return element.value;
+  }
+  return void 0;
+}
+
+export { migrate as default };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@grafana/create-plugin",
-  "version": "7.9.2",
+  "version": "7.10.1",
   "repository": {
     "type": "git",
     "directory": "packages/create-plugin",

package/src/codemods/migrations/migrations.ts

@@ -84,6 +84,13 @@ export default [
     description: 'Emit a single LICENSE.txt file for all licenses in bundled code.',
     scriptPath: import.meta.resolve('./scripts/012-terser-license-file.js'),
   },
+  {
+    name: '013-jest-esmodules',
+    version: '7.10.1',
+    description:
+      'Support @grafana/ui@13.2.0 in Jest by transforming @react-hookz/web and @ver0/deep-equal ESM dependencies.',
+    scriptPath: import.meta.resolve('./scripts/013-jest-esmodules.js'),
+  },
   // Do not use LEGACY_UPDATE_CUTOFF_VERSION for new migrations. It is only used above to force migrations to run
   // for those written before the switch to updates as migrations.
 ] satisfies Migration[];

package/src/codemods/migrations/scripts/013-jest-esmodules.test.ts

@@ -0,0 +1,99 @@
+import { describe, expect, it } from 'vitest';
+import migrate from './013-jest-esmodules.js';
+import { Context } from '../../context.js';
+
+const JEST_UTILS_PATH = '.config/jest/utils.js';
+
+const JEST_UTILS = `/*
+ * ⚠️⚠️⚠️ THIS FILE WAS SCAFFOLDED BY \`@grafana/create-plugin\`. DO NOT EDIT THIS FILE DIRECTLY. ⚠️⚠️⚠️
+ *
+ * In order to extend the configuration follow the steps in .config/README.md
+ */
+
+/*
+ * This utility function is useful in combination with jest \`transformIgnorePatterns\` config
+ * to transform specific packages (e.g.ES modules) in a projects node_modules folder.
+ */
+const nodeModulesToTransform = (moduleNames) => \`node_modules\\/(?!.*(\${moduleNames.join('|')})\\/.*)\`;
+
+// Array of known nested grafana package dependencies that only bundle an ESM version
+const grafanaESModules = [
+  '.pnpm', // Support using pnpm symlinked packages
+  '@grafana/schema',
+  '@wojtekmaj/date-utils',
+  'd3',
+  'uuid',
+];
+
+module.exports = {
+  nodeModulesToTransform,
+  grafanaESModules,
+};
+`;
+
+describe('013-jest-esmodules', () => {
+  it('should add @react-hookz/web and @ver0/deep-equal to grafanaESModules', () => {
+    const context = new Context('/virtual');
+    context.addFile(JEST_UTILS_PATH, JEST_UTILS);
+
+    const result = migrate(context);
+    const updated = result.getFile(JEST_UTILS_PATH) ?? '';
+
+    expect(updated).toContain("'@react-hookz/web'");
+    expect(updated).toContain("'@ver0/deep-equal'");
+    expect(updated.indexOf("'@grafana/schema'")).toBeLessThan(updated.indexOf("'@react-hookz/web'"));
+    expect(updated.indexOf("'@ver0/deep-equal'")).toBeLessThan(updated.indexOf("'@wojtekmaj/date-utils'"));
+  });
+
+  it('should only add missing modules', () => {
+    const context = new Context('/virtual');
+    context.addFile(
+      JEST_UTILS_PATH,
+      JEST_UTILS.replace("'@wojtekmaj/date-utils',", "'@react-hookz/web',\n  '@wojtekmaj/date-utils',")
+    );
+
+    const result = migrate(context);
+    const updated = result.getFile(JEST_UTILS_PATH) ?? '';
+
+    expect(updated.match(/'@react-hookz\/web'/g)).toHaveLength(1);
+    expect(updated.match(/'@ver0\/deep-equal'/g)).toHaveLength(1);
+  });
+
+  it('should be idempotent', async () => {
+    const context = new Context('/virtual');
+    context.addFile(JEST_UTILS_PATH, JEST_UTILS);
+
+    await expect(migrate).toBeIdempotent(context);
+  });
+
+  it('should do nothing when the Jest utils file does not exist', () => {
+    const context = new Context('/virtual');
+
+    const result = migrate(context);
+
+    expect(result.hasChanges()).toBe(false);
+  });
+
+  it('should do nothing when grafanaESModules is missing', () => {
+    const context = new Context('/virtual');
+    const customizedUtils = JEST_UTILS.replace('const grafanaESModules = [', 'const customESModules = [');
+    context.addFile(JEST_UTILS_PATH, customizedUtils);
+
+    const result = migrate(context);
+
+    expect(result.getFile(JEST_UTILS_PATH)).toBe(customizedUtils);
+  });
+
+  it('should do nothing when grafanaESModules is not an array', () => {
+    const context = new Context('/virtual');
+    const customizedUtils = JEST_UTILS.replace(
+      /const grafanaESModules = \[[\s\S]*?\];/,
+      "const grafanaESModules = require('./grafana-es-modules');"
+    );
+    context.addFile(JEST_UTILS_PATH, customizedUtils);
+
+    const result = migrate(context);
+
+    expect(result.getFile(JEST_UTILS_PATH)).toBe(customizedUtils);
+  });
+});

package/src/codemods/migrations/scripts/013-jest-esmodules.ts

@@ -0,0 +1,79 @@
+import { join } from 'node:path';
+import * as recast from 'recast';
+import type { Context } from '../../context.js';
+import { migrationsDebug } from '../../utils.js';
+import { findVariableDeclaration, parseAsTypescript, printAST } from '../../utils.ast.js';
+
+const { builders } = recast.types;
+
+const JEST_UTILS_PATH = join('.config', 'jest', 'utils.js');
+const ESM_MODULES_TO_ADD = ['@react-hookz/web', '@ver0/deep-equal'];
+
+export default function migrate(context: Context): Context {
+  if (!context.doesFileExist(JEST_UTILS_PATH)) {
+    migrationsDebug(`${JEST_UTILS_PATH} not found. Skipping Jest ESM modules migration.`);
+    return context;
+  }
+
+  const source = context.getFile(JEST_UTILS_PATH);
+  if (!source) {
+    migrationsDebug(`${JEST_UTILS_PATH} is empty. Skipping Jest ESM modules migration.`);
+    return context;
+  }
+
+  const parsed = parseAsTypescript(source);
+  if (!parsed.success) {
+    migrationsDebug(`Failed to parse ${JEST_UTILS_PATH}. Error: ${parsed.error.message}`);
+    return context;
+  }
+
+  const grafanaESModules = findVariableDeclaration(parsed.ast, 'grafanaESModules');
+  if (!grafanaESModules) {
+    migrationsDebug(`Could not find grafanaESModules variable declaration in ${JEST_UTILS_PATH}`);
+    return context;
+  }
+
+  if (grafanaESModules.init?.type !== 'ArrayExpression') {
+    migrationsDebug(`grafanaESModules variable in ${JEST_UTILS_PATH} is not an array.`);
+    return context;
+  }
+
+  const existingModules = new Set(
+    grafanaESModules.init.elements.map(getStringValue).filter((value) => value !== undefined)
+  );
+  const missingModules = ESM_MODULES_TO_ADD.filter((moduleName) => !existingModules.has(moduleName));
+
+  if (missingModules.length === 0) {
+    return context;
+  }
+
+  const schemaIndex = grafanaESModules.init.elements.findIndex(
+    (element) => getStringValue(element) === '@grafana/schema'
+  );
+  const insertIndex = schemaIndex === -1 ? grafanaESModules.init.elements.length : schemaIndex + 1;
+
+  grafanaESModules.init.elements.splice(
+    insertIndex,
+    0,
+    ...missingModules.map((moduleName) => builders.literal(moduleName))
+  );
+  context.updateFile(JEST_UTILS_PATH, printAST(parsed.ast));
+
+  return context;
+}
+
+function getStringValue(element: recast.types.namedTypes.ArrayExpression['elements'][number]): string | undefined {
+  if (!element) {
+    return undefined;
+  }
+
+  if (element.type === 'Literal' && typeof element.value === 'string') {
+    return element.value;
+  }
+
+  if (element.type === 'StringLiteral') {
+    return element.value;
+  }
+
+  return undefined;
+}

package/templates/common/.config/jest/utils.js

@@ -14,6 +14,8 @@ const nodeModulesToTransform = (moduleNames) => `node_modules\/(?!.*(${moduleNam
 const grafanaESModules = [
   '.pnpm', // Support using pnpm symlinked packages
   '@grafana/schema',
+  '@react-hookz/web',
+  '@ver0/deep-equal',
   '@wojtekmaj/date-utils',
   'd3',
   'd3-color',

package/templates/common/.config/playwright.config.ts

@@ -0,0 +1,54 @@
+/**
+ * ⚠️⚠️⚠️ THIS FILE WAS SCAFFOLDED BY `@grafana/create-plugin`. DO NOT EDIT THIS FILE DIRECTLY. ⚠️⚠️⚠️
+ *
+ * To extend the configuration, follow the steps in
+ * https://grafana.com/developers/plugin-tools/how-to-guides/extend-configurations#extend-the-playwright-config
+ */
+
+import type { PluginOptions } from '@grafana/plugin-e2e';
+import { defineConfig, devices } from '@playwright/test';
+import { dirname } from 'node:path';
+
+const pluginE2eAuth = `${dirname(require.resolve('@grafana/plugin-e2e'))}/auth`;
+
+/**
+ * See https://playwright.dev/docs/test-configuration.
+ */
+export default defineConfig<PluginOptions>({
+  testDir: './tests',
+  /* Run tests in files in parallel */
+  fullyParallel: true,
+  /* Fail the build on CI if you accidentally left test.only in the source code. */
+  forbidOnly: !!process.env.CI,
+  /* Retry on CI only */
+  retries: process.env.CI ? 2 : 0,
+  /* Reporter to use. See https://playwright.dev/docs/test-reporters */
+  reporter: 'html',
+  /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
+  use: {
+    /* Base URL to use in actions like `await page.goto('/')`. */
+    baseURL: process.env.GRAFANA_URL || 'http://localhost:3000',
+
+    /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
+    trace: 'on-first-retry',
+  },
+
+  /* Configure projects for major browsers */
+  projects: [
+    // 1. Login to Grafana and store the cookie on disk for use in other tests.
+    {
+      name: 'auth',
+      testDir: pluginE2eAuth,
+      testMatch: [/.*\.js/],
+    },
+    // 2. Run tests in Google Chrome. Every test will start authenticated as admin user.
+    {
+      name: 'chromium',
+      use: {
+        ...devices['Desktop Chrome'],
+        storageState: 'playwright/.auth/admin.json',
+      },
+      dependencies: ['auth'],
+    },
+  ],
+});

package/templates/common/.nvmrc

@@ -1 +1 @@
-22
+24

package/templates/common/_package.json

@@ -17,7 +17,7 @@
   "license": "Apache-2.0",
   "devDependencies": {
     "@grafana/eslint-config": "^9.0.0",
-    "@grafana/plugin-e2e": "^3.10.0",
+    "@grafana/plugin-e2e": "^3.11.0",
     "@grafana/sign-plugin": "^3.3.3",
     "@grafana/tsconfig": "^2.2.0",
     "@playwright/test": "^1.62.1",{{#if useExperimentalRspack}}

package/templates/common/playwright.config

@@ -1,8 +1,6 @@
 import type { PluginOptions } from '@grafana/plugin-e2e';
-import { defineConfig, devices } from '@playwright/test';
-import { dirname } from 'node:path';
-
-const pluginE2eAuth = `${dirname(require.resolve('@grafana/plugin-e2e'))}/auth`;
+import { defineConfig } from '@playwright/test';
+import baseConfig from './.config/playwright.config';
 
 /**
  * Read environment variables from file.
@@ -13,42 +11,7 @@ const pluginE2eAuth = `${dirname(require.resolve('@grafana/plugin-e2e'))}/auth`;
 /**
  * See https://playwright.dev/docs/test-configuration.
  */
-export default defineConfig<PluginOptions>({
-  testDir: './tests',
-  /* Run tests in files in parallel */
-  fullyParallel: true,
-  /* Fail the build on CI if you accidentally left test.only in the source code. */
-  forbidOnly: !!process.env.CI,
-  /* Retry on CI only */
-  retries: process.env.CI ? 2 : 0,
-  /* Reporter to use. See https://playwright.dev/docs/test-reporters */
-  reporter: 'html',
-  /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
-  use: {
-    /* Base URL to use in actions like `await page.goto('/')`. */
-    baseURL: process.env.GRAFANA_URL || 'http://localhost:3000',
-
-    /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
-    trace: 'on-first-retry',
-  },
-
-  /* Configure projects for major browsers */
-  projects: [
-    // 1. Login to Grafana and store the cookie on disk for use in other tests.
-    {
-      name: 'auth',
-      testDir: pluginE2eAuth,
-      testMatch: [/.*\.js/],
-    },
-    // 2. Run tests in Google Chrome. Every test will start authenticated as admin user.
-    {
-      name: 'chromium',
-      use: {
-        ...devices['Desktop Chrome'],
-        storageState: 'playwright/.auth/admin.json',
-      },
-      dependencies: ['auth'],
-    },
-  ],
-
+export default defineConfig<PluginOptions>(baseConfig, {
+  // Add your own configuration here.
+  // See https://grafana.com/developers/plugin-tools/how-to-guides/extend-configurations#extend-the-playwright-config for further info.
 });