Skip to content

Comments

chore: provide React 19 support#1551

Merged
VikaCep merged 6 commits intomainfrom
chore/react-19-preparation
Jan 27, 2026
Merged

chore: provide React 19 support#1551
VikaCep merged 6 commits intomainfrom
chore/react-19-preparation

Conversation

@VikaCep
Copy link
Contributor

@VikaCep VikaCep commented Jan 22, 2026

Summary

Takes recommended actions to make the app compatible with Grafana 13's React 19 migration.

Closes #1544


Changes Made

Workflow Updates:

  • updated.github/workflows/push.yml and .github/workflows/publish.yml to v6.0.0
  • fixed call_grafana-compat.yml - Moved permissions to top level
  • fixed call_renovate_reviewer.yml - Moved permissions to top level

Reusable workflows require permissions at workflow level, not job level, in v6.0.0

React 19 Compatibility Fixes

  • externalized react/jsx-runtime in webpack config (prevents __SECRET_INTERNALS crashes)
  • updated grafanaDependency to >=12.3.0 (required for jsx-runtime externalization, otherwise it breaks)

See https://docs.google.com/document/d/1ZBWYTkZQ_ra0oS050Wor11YM7PPQ82fV0n2NB6dGj1o/edit?tab=t.0#heading=h.8xoyr4y4o2pu for more info on this.


React 19 Compatibility Scan

Ran @grafana/react-detect tool per Grafana's React 19 guidance:

✅ Our Code: Clean

0 issues found - Our codebase is React 19 ready.

⚠️ Dependencies: 3 Real Issues

Dependency Issue Owner Action
react-draggable Uses findDOMNode @grafana/scenes may be fixed by upgrading scenes to v6
react-resizable Uses defaultProps/PropTypes @grafana/scenes may be fixed by upgrading scenes to v6
@tanstack/react-query Bundles jsx-runtime Fixed with webpack externals ✅ Fixed

ℹ️ False Positives: 2 (No Action Needed)

Dependency Flagged Issue Reality
ol ReactDOM.render No React dependency - pure canvas library
rc-slider ReactDOM.render Only uses flushSync (React 19 compatible)

Note: react-detect tool can produce false positives when dependencies support multiple React versions.


Validation

✅ Tested with React 19 Preview

Validated plugin functionality using Grafana's React 19 developer preview:

GRAFANA_VERSION=dev-preview-react19 GRAFANA_IMAGE=grafana yarn server

Results:

  • ✅ Plugin loads successfully
  • ✅ Core features work correctly
  • ✅ No runtime crashes
image

Notes:

Related PRs on upgrading to scenes v6:

- Updated push.yml from v4.3.0 to v6.0.0
- Updated publish.yml from v4.3.0 to v6.0.0
- Set run-playwright: true to test behavior without Playwright tests
- v6.0.0 adds React 19 testing support to E2E matrix

Testing in draft PR to determine if Playwright is needed for React 19 compatibility.
Ran @grafana/react-detect - found 0 issues in our code, only upstream dependencies.
@VikaCep VikaCep self-assigned this Jan 22, 2026
Required breaking change for plugin-ci-workflows v6.0.0.
Without this permission, the cd workflow job won't run.
Reusable workflows need permissions at top level, not job level.
This was preventing the workflow from being callable.
@github-actions github-actions bot added the chore A miscellaneous change added to the application. label Jan 22, 2026
@github-actions
Copy link

github-actions bot commented Jan 22, 2026

Script size changes

Name +/- Main This PR Outcome
[263.js] +4.20% 1,646.45 kB 1,715.58 kB
[234.js] New file - 804.37 kB
[datasource/module.js] -0.16% 24.56 kB 24.52 kB
[692.js] -3.66% 20.57 kB 19.82 kB
[663.js] = 5.84 kB 5.84 kB
[module.js] +0.99% 4.85 kB 4.90 kB
[88.js] Deleted file 984.46 kB -

Totals

Name +/- Main This PR Outcome
[Scripts] -4.16% 2,686.74 kB 2,575.03 kB
[Non-script Assets] +0.02% 2,671.09 kB 2,671.65 kB
[All] -2.07% 5,357.82 kB 5,246.68 kB

Generated by 🚫 dangerJS against 870dd58

Both call_grafana-compat.yml and call_renovate_reviewer.yml had permissions
at job level instead of workflow level, which is required for workflow_call.

This prevents 'workflow was not found' errors in v6.0.0.
@VikaCep VikaCep changed the title chore: Update plugin-ci-workflows to v6.0.0 for React 19 support chore: guarantee React 19 support Jan 22, 2026
@VikaCep VikaCep changed the title chore: guarantee React 19 support chore: provide React 19 support Jan 22, 2026
@VikaCep VikaCep marked this pull request as ready for review January 26, 2026 13:37
@VikaCep VikaCep requested a review from a team as a code owner January 26, 2026 13:37
@VikaCep VikaCep requested review from ckbedwell and w1kman and removed request for a team January 26, 2026 13:37
ckbedwell
ckbedwell previously approved these changes Jan 26, 2026
Copy link
Contributor

@ckbedwell ckbedwell left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM!

Copy link
Contributor

@ckbedwell ckbedwell left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🚀🚀🚀

@VikaCep VikaCep merged commit 468fab9 into main Jan 27, 2026
36 checks passed
@VikaCep VikaCep deleted the chore/react-19-preparation branch January 27, 2026 21:31
VikaCep added a commit that referenced this pull request Jan 30, 2026
* chore: update plugin-ci-workflows to v6.0.0 and test Playwright

- Updated push.yml from v4.3.0 to v6.0.0
- Updated publish.yml from v4.3.0 to v6.0.0
- Set run-playwright: true to test behavior without Playwright tests
- v6.0.0 adds React 19 testing support to E2E matrix

Testing in draft PR to determine if Playwright is needed for React 19 compatibility.
Ran @grafana/react-detect - found 0 issues in our code, only upstream dependencies.

* fix: add pull-requests:read permission for v6.0.0

Required breaking change for plugin-ci-workflows v6.0.0.
Without this permission, the cd workflow job won't run.

* fix: move permissions to top level in call_grafana-compat.yml

Reusable workflows need permissions at top level, not job level.
This was preventing the workflow from being callable.

* fix: move permissions to top level in reusable workflows

Both call_grafana-compat.yml and call_renovate_reviewer.yml had permissions
at job level instead of workflow level, which is required for workflow_call.

This prevents 'workflow was not found' errors in v6.0.0.

* fix: disable playwright tests

* chore: externalize react/jsx-runtime for React 19 compatibility
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

chore A miscellaneous change added to the application.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Prepare for React 19 prior to Grafana 13 release

2 participants