diff --git a/public/app/features/dashboard-scene/settings/variables/editors/CustomVariableEditor/CustomVariableEditor.test.tsx b/public/app/features/dashboard-scene/settings/variables/editors/CustomVariableEditor/CustomVariableEditor.test.tsx
index 425dc472671..e182ce1e2af 100644
--- a/public/app/features/dashboard-scene/settings/variables/editors/CustomVariableEditor/CustomVariableEditor.test.tsx
+++ b/public/app/features/dashboard-scene/settings/variables/editors/CustomVariableEditor/CustomVariableEditor.test.tsx
@@ -52,7 +52,13 @@ function renderEditor(ui: React.ReactNode) {
},
changeValuesFormat(newFormat: 'csv' | 'json') {
const targetLabel = newFormat === 'json' ? 'Object values in a JSON array' : 'Values separated by comma';
- fireEvent.click(elements.formatButton(targetLabel));
+
+ const formatButton = elements.formatButton(targetLabel);
+ if (formatButton === null) {
+ throw new Error(`Unable to fire a "click" event - button with label "${targetLabel}" not found in DOM`);
+ }
+
+ fireEvent.click(formatButton);
},
},
};
@@ -139,7 +145,7 @@ describe('CustomVariableEditor', () => {
});
describe('JSON values format', () => {
- const initialQuery = `[
+ const initialJsonQuery = `[
{"value":1,"text":"Development","aws":"dev","azure":"development"},
{"value":2,"text":"Production","aws":"prod","azure":"production"}
]`;
@@ -147,14 +153,14 @@ describe('CustomVariableEditor', () => {
it('should render CustomVariableForm with the correct initial values', () => {
const { variable, onRunQuery } = setup({
valuesFormat: 'json',
- query: initialQuery,
+ query: initialJsonQuery,
isMulti: true,
includeAll: true,
});
const { elements } = renderEditor();
- expect(elements.queryInput().value).toBe(initialQuery);
+ expect(elements.queryInput().value).toBe(initialJsonQuery);
expect(elements.multiValueCheckbox().checked).toBe(true);
expect(elements.allowCustomValueCheckbox()).not.toBeInTheDocument();
expect(elements.includeAllCheckbox().checked).toBe(true);
@@ -164,7 +170,7 @@ describe('CustomVariableEditor', () => {
describe('when the values textarea loses focus after its value has changed', () => {
describe('if the value is valid JSON', () => {
it('should update the query in the variable state and call the onRunQuery callback', async () => {
- const { variable, onRunQuery } = setup({ valuesFormat: 'json', query: initialQuery });
+ const { variable, onRunQuery } = setup({ valuesFormat: 'json', query: initialJsonQuery });
const { actions } = renderEditor();
@@ -177,7 +183,7 @@ describe('CustomVariableEditor', () => {
describe('if the value is NOT valid JSON', () => {
it('should display a validation error message and neither update the query in the variable state nor call the onRunQuery callback', async () => {
- const { variable, onRunQuery } = setup({ valuesFormat: 'json', query: initialQuery });
+ const { variable, onRunQuery } = setup({ valuesFormat: 'json', query: initialJsonQuery });
const { actions, getByRole } = renderEditor(
@@ -186,7 +192,7 @@ describe('CustomVariableEditor', () => {
actions.updateValuesInput('[x]');
expect(getByRole('alert')).toHaveTextContent(`Unexpected token 'x', "[x]" is not valid JSON`);
- expect(variable.state.query).toBe(initialQuery);
+ expect(variable.state.query).toBe(initialJsonQuery);
expect(onRunQuery).not.toHaveBeenCalled();
});
});