Dashboards: Never show scopes variables (#116132)

2026-01-12 18:52:23 +01:00
parent 1263a3d364
commit 69bf3068b3
2 changed files with 86 additions and 1 deletions
@@ -0,0 +1,84 @@
+import { render, screen } from '@testing-library/react';
+
+import { VariableHide } from '@grafana/data';
+import { SceneGridLayout, SceneVariable, SceneVariableSet, ScopesVariable, TextBoxVariable } from '@grafana/scenes';
+
+import { DashboardScene } from './DashboardScene';
+import { VariableControls } from './VariableControls';
+import { DefaultGridLayoutManager } from './layout-default/DefaultGridLayoutManager';
+
+jest.mock('@grafana/runtime', () => {
+  const runtime = jest.requireActual('@grafana/runtime');
+  return {
+    ...runtime,
+    config: {
+      ...runtime.config,
+      featureToggles: {
+        dashboardNewLayouts: true,
+      },
+    },
+  };
+});
+
+describe('VariableControls', () => {
+  it('should not render scopes variable', () => {
+    const variables = [new ScopesVariable({})];
+    const dashboard = buildScene(variables);
+    dashboard.activate();
+
+    render(<VariableControls dashboard={dashboard} />);
+
+    expect(screen.queryByText('__scopes')).not.toBeInTheDocument();
+  });
+
+  it('should not render regular hidden variables', () => {
+    const hiddenVariable = new TextBoxVariable({
+      name: 'HiddenVar',
+      hide: VariableHide.hideVariable,
+    });
+    const variables = [hiddenVariable];
+    const dashboard = buildScene(variables);
+    dashboard.activate();
+
+    render(<VariableControls dashboard={dashboard} />);
+
+    expect(screen.queryByText('HiddenVar')).not.toBeInTheDocument();
+  });
+
+  it('should render regular hidden variables in edit mode', async () => {
+    const hiddenVariable = new TextBoxVariable({
+      name: 'HiddenVar',
+      hide: VariableHide.hideVariable,
+    });
+    const variables = [hiddenVariable];
+    const dashboard = buildScene(variables);
+    dashboard.activate();
+
+    dashboard.setState({ isEditing: true });
+    render(<VariableControls dashboard={dashboard} />);
+
+    expect(await screen.findByText('HiddenVar')).toBeInTheDocument();
+  });
+
+  it('should not render variables hidden in controls menu in edit mode', async () => {
+    const dashboard = buildScene([new TextBoxVariable({ name: 'TextVarControls', hide: VariableHide.inControlsMenu })]);
+    dashboard.activate();
+
+    dashboard.setState({ isEditing: true });
+    render(<VariableControls dashboard={dashboard} />);
+
+    expect(screen.queryByText('TextVarControls')).not.toBeInTheDocument();
+  });
+});
+
+function buildScene(variables: SceneVariable[] = []) {
+  const dashboard = new DashboardScene({
+    $variables: new SceneVariableSet({ variables }),
+    body: new DefaultGridLayoutManager({
+      grid: new SceneGridLayout({
+        children: [],
+      }),
+    }),
+  });
+  return dashboard;
+}
@@ -39,8 +39,9 @@ export function VariableControls({ dashboard }: { dashboard: DashboardScene }) {
    ? restVariables.filter((v) => v.state.hide !== VariableHide.inControlsMenu)
    : variables.filter(
        (v) =>
+          // used for scopes variables, should always be hidden
          // if we're editing in dynamic dashboards, still shows hidden variable but greyed out
-          (isEditingNewLayouts && v.state.hide === VariableHide.hideVariable) ||
+          (!v.UNSAFE_renderAsHidden && isEditingNewLayouts && v.state.hide === VariableHide.hideVariable) ||
          v.state.hide !== VariableHide.inControlsMenu
      );