Update notebooks snapshots and cypress (opensearch-project#1367)

* update notebooks cypress Signed-off-by: Shenoy Pratik <[email protected]> * update tests for query check Signed-off-by: Shenoy Pratik <[email protected]> * update ppl query check Signed-off-by: Shenoy Pratik <[email protected]> * fix detele notebooks, page reload issue Signed-off-by: Shenoy Pratik <[email protected]> * adding focus to inputs Signed-off-by: Shenoy Pratik <[email protected]> * move link check test at the end Signed-off-by: Shenoy Pratik <[email protected]> * fix focus for code input tests Signed-off-by: Shenoy Pratik <[email protected]> --------- Signed-off-by: Shenoy Pratik <[email protected]>
joshuali925 · Jan 19, 2024 · 8f1f83a · 8f1f83a
1 parent 16ce008
commit 8f1f83a
Show file tree

Hide file tree

Showing 13 changed files with 333 additions and 282 deletions.
diff --git a/.cypress/integration/notebooks_test/notebooks.spec.js b/.cypress/integration/notebooks_test/notebooks.spec.js
diff --git a/.cypress/utils/constants.js b/.cypress/utils/constants.js
@@ -3,9 +3,6 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-export const delay = 1500;
-export const COMMAND_TIMEOUT_LONG = 10000;
-
 //BASE Constants
 export const BACKEND_BASE_PATH = Cypress.env('opensearch');
 export const FONTEND_BASE_PATH = Cypress.env('opensearchDashboards');
@@ -14,7 +11,7 @@ export const FONTEND_BASE_PATH = Cypress.env('opensearchDashboards');
 export const DATASOURCES_API_PREFIX = '/app/datasources';
 export const DATASOURCES_PATH = {
   DATASOURCES_CREATION_BASE: `${DATASOURCES_API_PREFIX}#/new`,
-  DATASOURCES_CONFIG_BASE: `${DATASOURCES_API_PREFIX}#/configure`
+  DATASOURCES_CONFIG_BASE: `${DATASOURCES_API_PREFIX}#/configure`,
 };
 
 // trace analytics
@@ -26,34 +23,44 @@ export const AUTH_SERVICE_SPAN_ID = '277a5934acf55dcf';
 
 export const testDataSet = [
   {
-    mapping_url: 'https://raw.githubusercontent.com/opensearch-project/dashboards-observability/main/.cypress/utils/otel-v1-apm-service-map-mappings.json',
-    data_url: 'https://raw.githubusercontent.com/opensearch-project/dashboards-observability/main/.cypress/utils/otel-v1-apm-service-map.json',
+    mapping_url:
+      'https://raw.githubusercontent.com/opensearch-project/dashboards-observability/main/.cypress/utils/otel-v1-apm-service-map-mappings.json',
+    data_url:
+      'https://raw.githubusercontent.com/opensearch-project/dashboards-observability/main/.cypress/utils/otel-v1-apm-service-map.json',
     index: 'otel-v1-apm-service-map',
   },
   {
-    mapping_url: 'https://raw.githubusercontent.com/opensearch-project/dashboards-observability/main/.cypress/utils/otel-v1-apm-span-000001-mappings.json',
-    data_url: 'https://raw.githubusercontent.com/opensearch-project/dashboards-observability/main/.cypress/utils/otel-v1-apm-span-000001.json',
+    mapping_url:
+      'https://raw.githubusercontent.com/opensearch-project/dashboards-observability/main/.cypress/utils/otel-v1-apm-span-000001-mappings.json',
+    data_url:
+      'https://raw.githubusercontent.com/opensearch-project/dashboards-observability/main/.cypress/utils/otel-v1-apm-span-000001.json',
     index: 'otel-v1-apm-span-000001',
   },
   {
-    mapping_url: 'https://raw.githubusercontent.com/opensearch-project/dashboards-observability/main/.cypress/utils/otel-v1-apm-span-000001-mappings.json',
-    data_url: 'https://raw.githubusercontent.com/opensearch-project/dashboards-observability/main/.cypress/utils/otel-v1-apm-span-000002.json',
+    mapping_url:
+      'https://raw.githubusercontent.com/opensearch-project/dashboards-observability/main/.cypress/utils/otel-v1-apm-span-000001-mappings.json',
+    data_url:
+      'https://raw.githubusercontent.com/opensearch-project/dashboards-observability/main/.cypress/utils/otel-v1-apm-span-000002.json',
     index: 'otel-v1-apm-span-000002',
   },
-]
+];
 
 export const jaegerTestDataSet = [
   {
-    mapping_url: 'https://raw.githubusercontent.com/opensearch-project/dashboards-observability/main/.cypress/utils/jaeger-service-2023-01-24-mappings.json',
-    data_url: 'https://raw.githubusercontent.com/opensearch-project/dashboards-observability/main/.cypress/utils/jaeger-service-2023-01-24.json',
+    mapping_url:
+      'https://raw.githubusercontent.com/opensearch-project/dashboards-observability/main/.cypress/utils/jaeger-service-2023-01-24-mappings.json',
+    data_url:
+      'https://raw.githubusercontent.com/opensearch-project/dashboards-observability/main/.cypress/utils/jaeger-service-2023-01-24.json',
     index: 'jaeger-service-2023-01-24',
   },
   {
-    mapping_url: 'https://raw.githubusercontent.com/opensearch-project/dashboards-observability/main/.cypress/utils/jaeger-span-2023-01-24-mappings.json',
-    data_url: 'https://raw.githubusercontent.com/opensearch-project/dashboards-observability/main/.cypress/utils/jaeger-span-2023-01-24.json',
+    mapping_url:
+      'https://raw.githubusercontent.com/opensearch-project/dashboards-observability/main/.cypress/utils/jaeger-span-2023-01-24-mappings.json',
+    data_url:
+      'https://raw.githubusercontent.com/opensearch-project/dashboards-observability/main/.cypress/utils/jaeger-span-2023-01-24.json',
     index: 'jaeger-span-2023-01-24',
   },
-]
+];
 
 export const setTimeFilter = (setEndTime = false, refresh = true) => {
   const startTime = 'Mar 25, 2021 @ 10:00:00.000';
@@ -78,15 +85,16 @@ export const setTimeFilter = (setEndTime = false, refresh = true) => {
       .type('{selectall}' + endTime, { force: true });
   }
   if (refresh) cy.get('.euiButton__text').contains('Refresh').click();
-  cy.get('.euiTableRow').should('have.length.greaterThan', 3);//Replaces Wait
+  cy.get('.euiTableRow').should('have.length.greaterThan', 3); //Replaces Wait
 };
 
 // notebooks
 export const TEST_NOTEBOOK = 'Test Notebook';
 export const TEST_INTEGRATION_INSTANCE = 'nginx-test';
 export const TEST_SAMPLE_INSTANCE = 'nginx-sample';
 export const SAMPLE_URL = 'https://github.com/opensearch-project/sql/tree/main/sql-jdbc';
-export const NOTEBOOK_TEXT = 'Use Notebooks to interactively and collaboratively develop rich reports backed by live data. Common use cases for notebooks includes creating postmortem reports, designing run books, building live infrastructure reports, or even documentation.';
+export const NOTEBOOK_TEXT =
+  'Use Notebooks to interactively and collaboratively develop rich reports backed by live data. Common use cases for notebooks includes creating postmortem reports, designing run books, building live infrastructure reports, or even documentation.';
 export const OPENSEARCH_URL = 'https://opensearch.org/docs/latest/observability-plugin/notebooks/';
 export const MARKDOWN_TEXT = `%md
 # Heading 1
@@ -112,15 +120,15 @@ POST _plugins/_sql/_explain
 |----|----|----|----|
 | a2 | b2 | c2 | d2 |
 | a3 | b3 | c3 | d3 |
-`
+`;
 
-export const SQL_QUERY_TEXT = `%sql
-select * from opensearch_dashboards_sample_data_flights limit 20
-`
+export const SQL_QUERY_TEXT = `%sql 
+select * from opensearch_dashboards_sample_data_flights limit 20 {enter}
+`;
 
 export const PPL_QUERY_TEXT = `%ppl
-source=opensearch_dashboards_sample_data_flights
-`
+source=opensearch_dashboards_sample_data_flights {enter}
+`;
 
 export const suppressResizeObserverIssue = () => {
   // exception is thrown on loading EuiDataGrid in cypress only, ignore for now
@@ -137,28 +145,28 @@ export const verify_traces_spans_data_grid_cols_exists = () => {
   cy.get('.euiDataGridHeaderCell__content').contains('Start time').should('exist');
   cy.get('.euiDataGridHeaderCell__content').contains('End time').should('exist');
   cy.get('.euiDataGridHeaderCell__content').contains('Errors').should('exist');
-}
+};
 
 export const count_table_row = (expected_row_count) => {
-  cy.get('.euiDataGridHeader [role="columnheader"]').then($el => {
+  cy.get('.euiDataGridHeader [role="columnheader"]').then(($el) => {
     let colmun_header_count = Cypress.$($el).length;
     let table_grid_cell_count = Cypress.$('[data-test-subj="dataGridRowCell"]').length;
     const total_row_count = table_grid_cell_count / colmun_header_count;
-    expect(total_row_count).to.equal(expected_row_count)
+    expect(total_row_count).to.equal(expected_row_count);
   });
-}
+};
 
 Cypress.on('uncaught:exception', (err, runnable, promise) => {
   // when the exception originated from an unhandled promise
   // rejection, the promise is provided as a third argument
   // you can turn off failing the test in this case
   if (promise) {
-    return false
+    return false;
   }
   // we still want to ensure there are no other unexpected
   // errors, so we let them fail the test
-})
+});
 
 Cypress.on('uncaught:exception', (err, runnable) => {
   if (err.message.includes('ResizeObserver loop')) return false;
-})
+});
diff --git a/public/components/notebooks/components/__tests__/__snapshots__/note_table.test.tsx.snap b/public/components/notebooks/components/__tests__/__snapshots__/note_table.test.tsx.snap
@@ -36,6 +36,7 @@ exports[`<NoteTable /> spec renders the component 1`] = `
           >
             <h3
               class="euiTitle euiTitle--small"
+              data-test-subj="notebookTableTitle"
             >
               Notebooks
               <span
@@ -51,6 +52,7 @@ exports[`<NoteTable /> spec renders the component 1`] = `
             />
             <div
               class="euiText euiText--small"
+              data-test-subj="notebookTableDescription"
             >
               <div
                 class="euiTextColor euiTextColor--subdued"
@@ -99,6 +101,7 @@ exports[`<NoteTable /> spec renders the component 1`] = `
                   >
                     <button
                       class="euiButton euiButton--primary"
+                      data-test-subj="notebookTableActionBtn"
                       type="button"
                     >
                       <span
@@ -134,6 +137,7 @@ exports[`<NoteTable /> spec renders the component 1`] = `
               >
                 <a
                   class="euiButton euiButton--primary euiButton--fill"
+                  data-test-subj="createNotebookPrimaryBtn"
                   href="#/create"
                   rel="noreferrer"
                 >
@@ -951,6 +955,7 @@ exports[`<NoteTable /> spec renders the empty component 1`] = `
           >
             <h3
               class="euiTitle euiTitle--small"
+              data-test-subj="notebookTableTitle"
             >
               Notebooks
               <span
@@ -966,6 +971,7 @@ exports[`<NoteTable /> spec renders the empty component 1`] = `
             />
             <div
               class="euiText euiText--small"
+              data-test-subj="notebookTableDescription"
             >
               <div
                 class="euiTextColor euiTextColor--subdued"
@@ -1015,6 +1021,7 @@ exports[`<NoteTable /> spec renders the empty component 1`] = `
                   >
                     <button
                       class="euiButton euiButton--primary"
+                      data-test-subj="notebookTableActionBtn"
                       type="button"
                     >
                       <span
@@ -1049,6 +1056,7 @@ exports[`<NoteTable /> spec renders the empty component 1`] = `
               >
                 <a
                   class="euiButton euiButton--primary euiButton--fill"
+                  data-test-subj="createNotebookPrimaryBtn"
                   href="#/create"
                   rel="noreferrer"
                 >
@@ -1074,6 +1082,7 @@ exports[`<NoteTable /> spec renders the empty component 1`] = `
         />
         <div
           class="euiText euiText--medium"
+          data-test-subj="notebookEmptyTableText"
         >
           <div
             class="euiTextAlign euiTextAlign--center"
@@ -1108,7 +1117,7 @@ exports[`<NoteTable /> spec renders the empty component 1`] = `
           >
             <a
               class="euiButton euiButton--primary"
-              data-test-subj="note-table-empty-state-create-notebook-button"
+              data-test-subj="notebookEmptyTableCreateBtn"
               href="#/create"
               rel="noreferrer"
             >
@@ -1128,6 +1137,7 @@ exports[`<NoteTable /> spec renders the empty component 1`] = `
           >
             <button
               class="euiButton euiButton--primary"
+              data-test-subj="notebookEmptyTableAddSamplesBtn"
               type="button"
             >
               <span

diff --git a/public/components/notebooks/components/__tests__/__snapshots__/notebook.test.tsx.snap b/public/components/notebooks/components/__tests__/__snapshots__/notebook.test.tsx.snap
@@ -154,6 +154,7 @@ exports[`<Notebook /> spec Renders the empty component 1`] = `
       />
       <h1
         class="euiTitle euiTitle--large"
+        data-test-subj="notebookTitle"
       >
         sample-notebook-1
       </h1>
@@ -261,6 +262,7 @@ exports[`<Notebook /> spec Renders the empty component 1`] = `
                 >
                   <button
                     class="euiButton euiButton--primary"
+                    data-test-subj="emptyNotebookAddCodeBlockBtn"
                     style="margin-bottom: 17px;"
                     type="button"
                   >
@@ -469,6 +471,7 @@ exports[`<Notebook /> spec Renders the visualization component 1`] = `
       />
       <h1
         class="euiTitle euiTitle--large"
+        data-test-subj="notebookTitle"
       />
       <div
         class="euiSpacer euiSpacer--m"
@@ -574,6 +577,7 @@ exports[`<Notebook /> spec Renders the visualization component 1`] = `
                 >
                   <button
                     class="euiButton euiButton--primary"
+                    data-test-subj="emptyNotebookAddCodeBlockBtn"
                     style="margin-bottom: 17px;"
                     type="button"
                   >
@@ -823,6 +827,7 @@ exports[`<Notebook /> spec test reporting action button 1`] = `
       />
       <h1
         class="euiTitle euiTitle--large"
+        data-test-subj="notebookTitle"
       >
         sample-notebook-1
       </h1>
@@ -930,6 +935,7 @@ exports[`<Notebook /> spec test reporting action button 1`] = `
                 >
                   <button
                     class="euiButton euiButton--primary"
+                    data-test-subj="emptyNotebookAddCodeBlockBtn"
                     style="margin-bottom: 17px;"
                     type="button"
                   >

diff --git a/public/components/notebooks/components/__tests__/note_table.test.tsx b/public/components/notebooks/components/__tests__/note_table.test.tsx
@@ -238,20 +238,20 @@ describe('<NoteTable /> spec', () => {
 
   it('closes the action panel', async () => {
     const { getByText, queryByTestId } = renderNoteTable({ notebooks: [] });
-    expect(queryByTestId('rename-notebook-btn')).not.toBeInTheDocument();
+    expect(queryByTestId('renameNotebookBtn')).not.toBeInTheDocument();
 
     // Open Actions dropdown
     fireEvent.click(getByText('Actions'));
 
     // Ensure the action panel is open
-    expect(queryByTestId('rename-notebook-btn')).toBeInTheDocument();
+    expect(queryByTestId('renameNotebookBtn')).toBeInTheDocument();
 
     await act(async () => {
       fireEvent.click(getByText('Actions'));
     });
 
     // Ensure the action panel is closed
-    expect(queryByTestId('rename-notebook-btn')).not.toBeInTheDocument();
+    expect(queryByTestId('renameNotebookBtn')).not.toBeInTheDocument();
   });
 
   it('closes the delete modal', () => {