it()

in client/cypress/integration/visualizations/chart_spec.js [34:109]


  it("creates Bar charts", function() {
    cy.visit(`queries/${this.queryId}/source`);
    cy.getByTestId("ExecuteButton").click();

    const getBarChartAssertionFunction = (specificBarChartAssertionFn = () => {}) => () => {
      // checks for TabbedEditor standard tabs
      assertTabbedEditor();

      // standard chart should be bar
      cy.getByTestId("Chart.GlobalSeriesType").contains(".ant-select-selection-item", "Bar");

      // checks the plot canvas exists and is empty
      assertPlotPreview("not.exist");

      // creates a chart and checks it is plotted
      cy.getByTestId("Chart.ColumnMapping.x").selectAntdOption("Chart.ColumnMapping.x.stage");
      cy.getByTestId("Chart.ColumnMapping.y").selectAntdOption("Chart.ColumnMapping.y.value1");
      cy.getByTestId("Chart.ColumnMapping.y").selectAntdOption("Chart.ColumnMapping.y.value2");
      assertPlotPreview("exist");

      specificBarChartAssertionFn();
    };

    const chartTests = [
      {
        name: "Basic Bar Chart",
        alias: "basicBarChart",
        assertionFn: () => {
          assertAxesAndAddLabels("Stage", "Value");
        },
      },
      {
        name: "Horizontal Bar Chart",
        alias: "horizontalBarChart",
        assertionFn: () => {
          cy.getByTestId("Chart.SwappedAxes").check();
          cy.getByTestId("VisualizationEditor.Tabs.XAxis").should("have.text", "Y Axis");
          cy.getByTestId("VisualizationEditor.Tabs.YAxis").should("have.text", "X Axis");
        },
      },
      {
        name: "Stacked Bar Chart",
        alias: "stackedBarChart",
        assertionFn: () => {
          cy.getByTestId("Chart.Stacking").selectAntdOption("Chart.Stacking.Stack");
        },
      },
      {
        name: "Normalized Bar Chart",
        alias: "normalizedBarChart",
        assertionFn: () => {
          cy.getByTestId("Chart.NormalizeValues").check();
        },
      },
    ];

    chartTests.forEach(({ name, alias, assertionFn }) => {
      createChartThroughUI(name, getBarChartAssertionFunction(assertionFn)).as(alias);
    });

    const chartGetters = chartTests.map(({ alias }) => alias);

    const withDashboardWidgetsAssertionFn = (widgetGetters, dashboardUrl) => {
      cy.visit(dashboardUrl);
      widgetGetters.forEach(widgetGetter => {
        cy.get(`@${widgetGetter}`).then(widget => {
          cy.getByTestId(getWidgetTestId(widget)).within(() => {
            cy.get("g.points").should("exist");
          });
        });
      });
    };

    createDashboardWithCharts("Bar chart visualizations", chartGetters, withDashboardWidgetsAssertionFn);
    cy.percySnapshot("Visualizations - Charts - Bar");
  });