[8.9] [Security Solution] Unskipping Cypress local storage test (#161655

) (#163571)

# Backport

This will backport the following commits from `main` to `8.9`:
- [[Security Solution] Unskipping Cypress local storage test
(#161655)](#161655)

<!--- Backport version: 8.9.8 -->

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

<!--BACKPORT [{"author":{"name":"Gloria
Hornero","email":"[email protected]"},"sourceCommit":{"committedDate":"2023-07-12T13:56:20Z","message":"[Security
Solution] Unskipping Cypress local storage test
(#161655)","sha":"11856ab1d24d99b2ba1d07997705ecb37cd4703a","branchLabelMapping":{"^v8.10.0$":"main","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["release_note:skip","backport:skip","Team:Threat
Hunting","Team: SecuritySolution","Team:Threat
Hunting:Investigations","v8.10.0","v8.9.1"],"number":161655,"url":"https://github.com/elastic/kibana/pull/161655","mergeCommit":{"message":"[Security
Solution] Unskipping Cypress local storage test
(#161655)","sha":"11856ab1d24d99b2ba1d07997705ecb37cd4703a"}},"sourceBranch":"main","suggestedTargetBranches":["8.9"],"targetPullRequestStates":[{"branch":"main","label":"v8.10.0","labelRegex":"^v8.10.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/161655","number":161655,"mergeCommit":{"message":"[Security
Solution] Unskipping Cypress local storage test
(#161655)","sha":"11856ab1d24d99b2ba1d07997705ecb37cd4703a"}},{"branch":"8.9","label":"v8.9.1","labelRegex":"^v(\\d+).(\\d+).\\d+$","isSourceBranch":false,"state":"NOT_CREATED"}]}]
BACKPORT-->

Co-authored-by: Gloria Hornero <[email protected]>

x-pack/plugins/security_solution/cypress/e2e/investigations/timelines/local_storage.cy.ts

@@ -5,40 +5,40 @@
  * 2.0.
  */
 
-import { cleanKibana, reload } from '../../../tasks/common';
+import { reload } from '../../../tasks/common';
 import { login, visit } from '../../../tasks/login';
 import { HOSTS_URL } from '../../../urls/navigation';
 import { openEvents } from '../../../tasks/hosts/main';
-import { DATAGRID_HEADERS } from '../../../screens/timeline';
+import { DATAGRID_HEADERS, DATAGRID_HEADER } from '../../../screens/timeline';
 import { waitsForEventsToBeLoaded } from '../../../tasks/hosts/events';
 import { removeColumn } from '../../../tasks/timeline';
 
-// TODO: Fix bug in persisting the columns of timeline
-describe.skip('persistent timeline', () => {
+describe('persistent timeline', () => {
   before(() => {
-    cleanKibana();
     login();
     visit(HOSTS_URL);
     openEvents();
     waitsForEventsToBeLoaded();
+
+    /* Stores in 'expectedNumberOfTimelineColumns' alias the number of columns we are going to have
+    after the delition of the column */
     cy.get(DATAGRID_HEADERS).then((header) =>
       cy.wrap(header.length - 1).as('expectedNumberOfTimelineColumns')
     );
   });
 
   it('persist the deletion of a column', function () {
-    const MESSAGE_COLUMN = 'message';
-    const MESSAGE_COLUMN_POSITION = 2;
-
-    cy.get(DATAGRID_HEADERS).eq(MESSAGE_COLUMN_POSITION).should('have.text', MESSAGE_COLUMN);
-    removeColumn(MESSAGE_COLUMN);
-
-    cy.get(DATAGRID_HEADERS).should('have.length', this.expectedNumberOfTimelineColumns);
+    /* For testing purposes we are going to use the message column */
+    const COLUMN = 'message';
 
+    cy.get(DATAGRID_HEADER(COLUMN)).should('exist');
+    removeColumn(COLUMN);
     reload();
     waitsForEventsToBeLoaded();
 
+    /* After the deletion of the message column and the reload of the page, we make sure
+    we have the expected number of columns and that the message column is not displayed */
     cy.get(DATAGRID_HEADERS).should('have.length', this.expectedNumberOfTimelineColumns);
-    cy.get(DATAGRID_HEADERS).each(($el) => expect($el.text()).not.equal(MESSAGE_COLUMN));
+    cy.get(DATAGRID_HEADER(COLUMN)).should('not.exist');
   });
 });

x-pack/plugins/security_solution/cypress/screens/timeline.ts

@@ -39,8 +39,11 @@ export const CREATE_NEW_TIMELINE_TEMPLATE = '[data-test-subj="template-timeline-
 
 export const DATA_PROVIDERS = '.field-value';
 
-export const DATAGRID_HEADERS =
-  '[data-test-subj="events-viewer-panel"] [data-test-subj^="dataGridHeaderCell-"]';
+export const DATAGRID_HEADERS = '[data-test-subj^="dataGridHeaderCell-"]';
+
+export const DATAGRID_HEADER = (header: string) => {
+  return `[data-test-subj="dataGridHeaderCell-${header}"]`;
+};
 
 export const DATE_PICKER_END = '[data-test-subj="superDatePickerendDatePopoverButton"]';