[8.18] [Vega] Fix update vega spec in functional tests (#216620) (#216673)

# Backport

This will backport the following commits from `main` to `8.18`:
- [[Vega] Fix update vega spec in functional tests
(#216620)](https://github.com/elastic/kibana/pull/216620)

<!--- Backport version: 9.6.6 -->

### Questions ?
Please refer to the [Backport tool
documentation](https://github.com/sorenlouv/backport)

<!--BACKPORT [{"author":{"name":"Marco
Vettorello","email":"marco.vettorello@elastic.co"},"sourceCommit":{"committedDate":"2025-04-01T15:26:17Z","message":"[Vega]
Fix update vega spec in functional tests (#216620)\n\n## Summary\n\nThis
PR fixes a flaky test practice that was causing issues in
7.17\nbranch.\nThe flakiness was introduced long ago when the choosen
method to\nupdate/add more content to the Vega Spec was done by manually
clicking\nin the Vega spec editor the left border (where the editor
shows the line\nnumbers) to select all the text in the editor and go to
the last line\nbut a char before the end of the text (right before the
closing\nbracket).\n\nThe failure highlighted
by\nhttps://github.com/elastic/kibana/issues/213646 where caused the
added\n`config` text positioned in the wrong line/column due to the
Konami Code\nlike type of functional test operation.\n\n\nThe fix
instead provides a more robust method: it takes the written text\nin the
editor, parse it to JSON, update the JSON and write it back again\nto
the editor.\n\nWill fix the issue
https://github.com/elastic/kibana/issues/213646 when\nbackported to
7.17.","sha":"200ec10593480edc3ef7b0d0ea77b29c787d1382","branchLabelMapping":{"^v9.1.0$":"main","^v8.19.0$":"8.x","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["test","Team:Visualizations","release_note:skip","backport:all-open","v9.1.0"],"title":"[Vega]
Fix update vega spec in functional
tests","number":216620,"url":"https://github.com/elastic/kibana/pull/216620","mergeCommit":{"message":"[Vega]
Fix update vega spec in functional tests (#216620)\n\n## Summary\n\nThis
PR fixes a flaky test practice that was causing issues in
7.17\nbranch.\nThe flakiness was introduced long ago when the choosen
method to\nupdate/add more content to the Vega Spec was done by manually
clicking\nin the Vega spec editor the left border (where the editor
shows the line\nnumbers) to select all the text in the editor and go to
the last line\nbut a char before the end of the text (right before the
closing\nbracket).\n\nThe failure highlighted
by\nhttps://github.com/elastic/kibana/issues/213646 where caused the
added\n`config` text positioned in the wrong line/column due to the
Konami Code\nlike type of functional test operation.\n\n\nThe fix
instead provides a more robust method: it takes the written text\nin the
editor, parse it to JSON, update the JSON and write it back again\nto
the editor.\n\nWill fix the issue
https://github.com/elastic/kibana/issues/213646 when\nbackported to
7.17.","sha":"200ec10593480edc3ef7b0d0ea77b29c787d1382"}},"sourceBranch":"main","suggestedTargetBranches":[],"targetPullRequestStates":[{"branch":"main","label":"v9.1.0","branchLabelMappingKey":"^v9.1.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/216620","number":216620,"mergeCommit":{"message":"[Vega]
Fix update vega spec in functional tests (#216620)\n\n## Summary\n\nThis
PR fixes a flaky test practice that was causing issues in
7.17\nbranch.\nThe flakiness was introduced long ago when the choosen
method to\nupdate/add more content to the Vega Spec was done by manually
clicking\nin the Vega spec editor the left border (where the editor
shows the line\nnumbers) to select all the text in the editor and go to
the last line\nbut a char before the end of the text (right before the
closing\nbracket).\n\nThe failure highlighted
by\nhttps://github.com/elastic/kibana/issues/213646 where caused the
added\n`config` text positioned in the wrong line/column due to the
Konami Code\nlike type of functional test operation.\n\n\nThe fix
instead provides a more robust method: it takes the written text\nin the
editor, parse it to JSON, update the JSON and write it back again\nto
the editor.\n\nWill fix the issue
https://github.com/elastic/kibana/issues/213646 when\nbackported to
7.17.","sha":"200ec10593480edc3ef7b0d0ea77b29c787d1382"}}]}] BACKPORT-->

Co-authored-by: Marco Vettorello <marco.vettorello@elastic.co>
This commit is contained in:
Kibana Machine 2025-04-02 10:56:26 +02:00 committed by GitHub
parent b9e6f3d0e6
commit efa90a360d
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 22 additions and 11 deletions

View file

@ -96,7 +96,11 @@ export default function ({ getPageObjects, getService }: FtrProviderContext) {
});
it('should render different data in response to filter change', async function () {
await vegaChart.typeInSpec('"config": { "kibana": {"renderer": "svg"} },');
const { spec, isValid } = await vegaChart.getSpecAsJSON();
expect(isValid).to.be(true);
// add SVG renderer to read the Y axis labels
const updatedSpec = { ...spec, config: { kibana: { renderer: 'svg' } } };
await vegaChart.fillSpec(JSON.stringify(updatedSpec, null, 2));
await visEditor.clickGo();
await visChart.waitForVisualizationRenderingStabilized();
const fullDataLabels = await vegaChart.getYAxisLabels();

View file

@ -8,6 +8,7 @@
*/
import expect from '@kbn/expect';
import hjson from 'hjson';
import { FtrService } from '../ftr_provider_context';
const compareSpecs = (first: string, second: string) => {
@ -18,7 +19,6 @@ const compareSpecs = (first: string, second: string) => {
export class VegaChartPageObject extends FtrService {
private readonly find = this.ctx.getService('find');
private readonly testSubjects = this.ctx.getService('testSubjects');
private readonly browser = this.ctx.getService('browser');
private readonly retry = this.ctx.getService('retry');
private readonly monacoEditor = this.ctx.getService('monacoEditor');
@ -51,14 +51,17 @@ export class VegaChartPageObject extends FtrService {
});
}
public async typeInSpec(text: string) {
const editor = await this.testSubjects.find('vega-editor');
const textarea = await editor.findByCssSelector('textarea');
await textarea.focus();
await this.browser.pressKeys(this.browser.keys.RIGHT);
await this.browser.pressKeys(this.browser.keys.RIGHT);
await textarea.type(text);
public async getSpecAsJSON() {
const text = await this.monacoEditor.getCodeEditorValue();
try {
const spec = hjson.parse(text, { legacyRoot: false, keepWsc: true });
return {
spec,
isValid: true,
};
} catch (err) {
return { spec: text, isValid: false };
}
}
public async cleanSpec() {

View file

@ -86,7 +86,11 @@ export default function ({ getPageObjects, getService }: FtrProviderContext) {
});
it('should render different data in response to filter change', async function () {
await PageObjects.vegaChart.typeInSpec('"config": { "kibana": {"renderer": "svg"} },');
const { spec, isValid } = await PageObjects.vegaChart.getSpecAsJSON();
expect(isValid).to.be(true);
// add SVG renderer to read the Y axis labels
const updatedSpec = { ...spec, config: { kibana: { renderer: 'svg' } } };
await PageObjects.vegaChart.fillSpec(JSON.stringify(updatedSpec, null, 2));
await PageObjects.visEditor.clickGo();
await PageObjects.visChart.waitForVisualizationRenderingStabilized();
const fullDataLabels = await PageObjects.vegaChart.getYAxisLabels();