Add latest changes from gitlab-org/gitlab@master

24 files changed, 71 insertions, 70 deletions

diff --git a/spec/frontend/__helpers__/init_vue_mr_page_helper.js b/spec/frontend/__helpers__/init_vue_mr_page_helper.js
index 6b719a32480..ee01e9e6268 100644
--- a/spec/frontend/__helpers__/init_vue_mr_page_helper.js
+++ b/spec/frontend/__helpers__/init_vue_mr_page_helper.js
@@ -13,16 +13,16 @@ export default function initVueMRPage() {
   const diffsAppProjectPath = 'testproject';
   const mrEl = document.createElement('div');
   mrEl.className = 'merge-request fixture-mr';
-  mrEl.dataset.mrAction = 'diffs';
+  mrEl.setAttribute('data-mr-action', 'diffs');
   mrTestEl.appendChild(mrEl);
 
   const mrDiscussionsEl = document.createElement('div');
   mrDiscussionsEl.id = 'js-vue-mr-discussions';
-  mrDiscussionsEl.dataset.currentUserData = JSON.stringify(userDataMock);
-  mrDiscussionsEl.dataset.noteableData = JSON.stringify(noteableDataMock);
-  mrDiscussionsEl.dataset.notesData = JSON.stringify(notesDataMock);
-  mrDiscussionsEl.dataset.noteableType = 'merge-request';
-  mrDiscussionsEl.dataset.isLocked = 'false';
+  mrDiscussionsEl.setAttribute('data-current-user-data', JSON.stringify(userDataMock));
+  mrDiscussionsEl.setAttribute('data-noteable-data', JSON.stringify(noteableDataMock));
+  mrDiscussionsEl.setAttribute('data-notes-data', JSON.stringify(notesDataMock));
+  mrDiscussionsEl.setAttribute('data-noteable-type', 'merge-request');
+  mrDiscussionsEl.setAttribute('data-is-locked', 'false');
   mrTestEl.appendChild(mrDiscussionsEl);
 
   const discussionCounterEl = document.createElement('div');
@@ -31,9 +31,9 @@ export default function initVueMRPage() {
 
   const diffsAppEl = document.createElement('div');
   diffsAppEl.id = 'js-diffs-app';
-  diffsAppEl.dataset.endpoint = diffsAppEndpoint;
-  diffsAppEl.dataset.projectPath = diffsAppProjectPath;
-  diffsAppEl.dataset.currentUserData = JSON.stringify(userDataMock);
+  diffsAppEl.setAttribute('data-endpoint', diffsAppEndpoint);
+  diffsAppEl.setAttribute('data-project-path', diffsAppProjectPath);
+  diffsAppEl.setAttribute('data-current-user-data', JSON.stringify(userDataMock));
   mrTestEl.appendChild(diffsAppEl);
 
   const mock = new MockAdapter(axios);
diff --git a/spec/frontend/__helpers__/matchers/to_have_sprite_icon.js b/spec/frontend/__helpers__/matchers/to_have_sprite_icon.js
index 45b9c31c4db..bce9d93bea8 100644
--- a/spec/frontend/__helpers__/matchers/to_have_sprite_icon.js
+++ b/spec/frontend/__helpers__/matchers/to_have_sprite_icon.js
@@ -9,7 +9,7 @@ export const toHaveSpriteIcon = (element, iconName) => {
 
   const iconReferences = [].slice.apply(element.querySelectorAll('svg use'));
   const matchingIcon = iconReferences.find(
-    (reference) => reference.parentNode.dataset.testid === `${iconName}-icon`,
+    (reference) => reference.parentNode.getAttribute('data-testid') === `${iconName}-icon`,
   );
 
   const pass = Boolean(matchingIcon);
diff --git a/spec/frontend/admin/users/index_spec.js b/spec/frontend/admin/users/index_spec.js
index 961fa96acdd..06dbadd6d3d 100644
--- a/spec/frontend/admin/users/index_spec.js
+++ b/spec/frontend/admin/users/index_spec.js
@@ -12,8 +12,8 @@ describe('initAdminUsersApp', () => {
 
   beforeEach(() => {
     el = document.createElement('div');
-    el.dataset.users = JSON.stringify(users);
-    el.dataset.paths = JSON.stringify(paths);
+    el.setAttribute('data-users', JSON.stringify(users));
+    el.setAttribute('data-paths', JSON.stringify(paths));
 
     wrapper = createWrapper(initAdminUsersApp(el));
   });
@@ -40,8 +40,8 @@ describe('initAdminUserActions', () => {
 
   beforeEach(() => {
     el = document.createElement('div');
-    el.dataset.user = JSON.stringify(user);
-    el.dataset.paths = JSON.stringify(paths);
+    el.setAttribute('data-user', JSON.stringify(user));
+    el.setAttribute('data-paths', JSON.stringify(paths));
 
     wrapper = createWrapper(initAdminUserActions(el));
   });
diff --git a/spec/frontend/authentication/two_factor_auth/index_spec.js b/spec/frontend/authentication/two_factor_auth/index_spec.js
index f9a6b2df662..0ff9d60f409 100644
--- a/spec/frontend/authentication/two_factor_auth/index_spec.js
+++ b/spec/frontend/authentication/two_factor_auth/index_spec.js
@@ -15,8 +15,8 @@ describe('initRecoveryCodes', () => {
   beforeEach(() => {
     el = document.createElement('div');
     el.setAttribute('class', 'js-2fa-recovery-codes');
-    el.dataset.codes = codesJsonString;
-    el.dataset.profileAccountPath = profileAccountPath;
+    el.setAttribute('data-codes', codesJsonString);
+    el.setAttribute('data-profile-account-path', profileAccountPath);
     document.body.appendChild(el);
 
     wrapper = createWrapper(initRecoveryCodes());
diff --git a/spec/frontend/blob/components/table_contents_spec.js b/spec/frontend/blob/components/table_contents_spec.js
index 2cbac809a0d..358ac31819c 100644
--- a/spec/frontend/blob/components/table_contents_spec.js
+++ b/spec/frontend/blob/components/table_contents_spec.js
@@ -11,7 +11,7 @@ function createComponent() {
 }
 
 async function setLoaded(loaded) {
-  document.querySelector('.blob-viewer').dataset.loaded = loaded;
+  document.querySelector('.blob-viewer').setAttribute('data-loaded', loaded);
 
   await nextTick();
 }
@@ -53,7 +53,7 @@ describe('Markdown table of contents component', () => {
     it('does not show dropdown when viewing non-rich content', async () => {
       createComponent();
 
-      document.querySelector('.blob-viewer').dataset.type = 'simple';
+      document.querySelector('.blob-viewer').setAttribute('data-type', 'simple');
 
       await setLoaded(true);
 
diff --git a/spec/frontend/blob/viewer/index_spec.js b/spec/frontend/blob/viewer/index_spec.js
index b2559af182b..5f6baf3f63d 100644
--- a/spec/frontend/blob/viewer/index_spec.js
+++ b/spec/frontend/blob/viewer/index_spec.js
@@ -80,9 +80,9 @@ describe('Blob viewer', () => {
     return asyncClick()
       .then(() => asyncClick())
       .then(() => {
-        expect(document.querySelector('.blob-viewer[data-type="simple"]').dataset.loaded).toBe(
-          'true',
-        );
+        expect(
+          document.querySelector('.blob-viewer[data-type="simple"]').getAttribute('data-loaded'),
+        ).toBe('true');
       });
   });
 
diff --git a/spec/frontend/cascading_settings/components/lock_popovers_spec.js b/spec/frontend/cascading_settings/components/lock_popovers_spec.js
index 182e3c1c8ff..585e6ac505b 100644
--- a/spec/frontend/cascading_settings/components/lock_popovers_spec.js
+++ b/spec/frontend/cascading_settings/components/lock_popovers_spec.js
@@ -21,12 +21,12 @@ describe('LockPopovers', () => {
     };
 
     if (lockedByApplicationSetting) {
-      popoverMountEl.dataset.popoverData = JSON.stringify(popoverData);
+      popoverMountEl.setAttribute('data-popover-data', JSON.stringify(popoverData));
     } else if (lockedByAncestor) {
-      popoverMountEl.dataset.popoverData = JSON.stringify({
-        ...popoverData,
-        ancestor_namespace: mockNamespace,
-      });
+      popoverMountEl.setAttribute(
+        'data-popover-data',
+        JSON.stringify({ ...popoverData, ancestor_namespace: mockNamespace }),
+      );
     }
 
     document.body.appendChild(popoverMountEl);
diff --git a/spec/frontend/code_navigation/store/actions_spec.js b/spec/frontend/code_navigation/store/actions_spec.js
index 8eee61d1342..c47a9e697b6 100644
--- a/spec/frontend/code_navigation/store/actions_spec.js
+++ b/spec/frontend/code_navigation/store/actions_spec.js
@@ -195,8 +195,8 @@ describe('Code navigation actions', () => {
 
     it('commits SET_CURRENT_DEFINITION with LSIF data', () => {
       target.classList.add('js-code-navigation');
-      target.dataset.lineIndex = '0';
-      target.dataset.charIndex = '0';
+      target.setAttribute('data-line-index', '0');
+      target.setAttribute('data-char-index', '0');
 
       return testAction(
         actions.showDefinition,
@@ -218,8 +218,8 @@ describe('Code navigation actions', () => {
 
     it('adds hll class to target element', () => {
       target.classList.add('js-code-navigation');
-      target.dataset.lineIndex = '0';
-      target.dataset.charIndex = '0';
+      target.setAttribute('data-line-index', '0');
+      target.setAttribute('data-char-index', '0');
 
       return testAction(
         actions.showDefinition,
@@ -243,8 +243,8 @@ describe('Code navigation actions', () => {
 
     it('caches current target element', () => {
       target.classList.add('js-code-navigation');
-      target.dataset.lineIndex = '0';
-      target.dataset.charIndex = '0';
+      target.setAttribute('data-line-index', '0');
+      target.setAttribute('data-char-index', '0');
 
       return testAction(
         actions.showDefinition,
diff --git a/spec/frontend/confirm_modal_spec.js b/spec/frontend/confirm_modal_spec.js
index 4224fb6be2a..53991349ee5 100644
--- a/spec/frontend/confirm_modal_spec.js
+++ b/spec/frontend/confirm_modal_spec.js
@@ -31,9 +31,9 @@ describe('ConfirmModal', () => {
     buttons.forEach((x) => {
       const button = document.createElement('button');
       button.setAttribute('class', 'js-confirm-modal-button');
-      button.dataset.path = x.path;
-      button.dataset.method = x.method;
-      button.dataset.modalAttributes = JSON.stringify(x.modalAttributes);
+      button.setAttribute('data-path', x.path);
+      button.setAttribute('data-method', x.method);
+      button.setAttribute('data-modal-attributes', JSON.stringify(x.modalAttributes));
       button.innerHTML = 'Action';
       buttonContainer.appendChild(button);
     });
diff --git a/spec/frontend/helpers/startup_css_helper_spec.js b/spec/frontend/helpers/startup_css_helper_spec.js
index 05161437c22..2236b5aa261 100644
--- a/spec/frontend/helpers/startup_css_helper_spec.js
+++ b/spec/frontend/helpers/startup_css_helper_spec.js
@@ -59,10 +59,9 @@ describe('waitForCSSLoaded', () => {
         <link href="two.css" data-startupcss="loading">
       `);
       const events = waitForCSSLoaded(mockedCallback);
-      document.querySelectorAll('[data-startupcss="loading"]').forEach((elem) => {
-        // eslint-disable-next-line no-param-reassign
-        elem.dataset.startupcss = 'loaded';
-      });
+      document
+        .querySelectorAll('[data-startupcss="loading"]')
+        .forEach((elem) => elem.setAttribute('data-startupcss', 'loaded'));
       document.dispatchEvent(new CustomEvent('CSSStartupLinkLoaded'));
       await events;
 
diff --git a/spec/frontend/issues/create_merge_request_dropdown_spec.js b/spec/frontend/issues/create_merge_request_dropdown_spec.js
index cb7173c56a8..20b26f5abba 100644
--- a/spec/frontend/issues/create_merge_request_dropdown_spec.js
+++ b/spec/frontend/issues/create_merge_request_dropdown_spec.js
@@ -84,7 +84,7 @@ describe('CreateMergeRequestDropdown', () => {
     });
 
     it('enables when can create confidential issue', () => {
-      document.querySelector('.js-create-mr').dataset.isConfidential = 'true';
+      document.querySelector('.js-create-mr').setAttribute('data-is-confidential', 'true');
       confidentialState.selectedProject = { name: 'test' };
 
       dropdown.enable();
@@ -93,7 +93,7 @@ describe('CreateMergeRequestDropdown', () => {
     });
 
     it('does not enable when can not create confidential issue', () => {
-      document.querySelector('.js-create-mr').dataset.isConfidential = 'true';
+      document.querySelector('.js-create-mr').setAttribute('data-is-confidential', 'true');
 
       dropdown.enable();
 
diff --git a/spec/frontend/labels/delete_label_modal_spec.js b/spec/frontend/labels/delete_label_modal_spec.js
index 67220821fe0..98049538948 100644
--- a/spec/frontend/labels/delete_label_modal_spec.js
+++ b/spec/frontend/labels/delete_label_modal_spec.js
@@ -25,11 +25,11 @@ describe('DeleteLabelModal', () => {
     buttons.forEach((x) => {
       const button = document.createElement('button');
       button.setAttribute('class', 'js-delete-label-modal-button');
-      button.dataset.labelName = x.labelName;
-      button.dataset.destroyPath = x.destroyPath;
+      button.setAttribute('data-label-name', x.labelName);
+      button.setAttribute('data-destroy-path', x.destroyPath);
 
       if (x.subjectName) {
-        button.dataset.subjectName = x.subjectName;
+        button.setAttribute('data-subject-name', x.subjectName);
       }
 
       button.innerHTML = 'Action';
diff --git a/spec/frontend/lazy_loader_spec.js b/spec/frontend/lazy_loader_spec.js
index e0b6c7119f9..3d8b0d9c307 100644
--- a/spec/frontend/lazy_loader_spec.js
+++ b/spec/frontend/lazy_loader_spec.js
@@ -27,7 +27,7 @@ describe('LazyLoader', () => {
   const createLazyLoadImage = () => {
     const newImg = document.createElement('img');
     newImg.className = 'lazy';
-    newImg.dataset.src = TEST_PATH;
+    newImg.setAttribute('data-src', TEST_PATH);
 
     document.body.appendChild(newImg);
     triggerChildMutation();
@@ -108,7 +108,7 @@ describe('LazyLoader', () => {
 
         expect(LazyLoader.loadImage).toHaveBeenCalledWith(img);
         expect(img.getAttribute('src')).toBe(TEST_PATH);
-        expect(img.dataset.src).toBeUndefined();
+        expect(img.getAttribute('data-src')).toBe(null);
         expect(img).toHaveClass('js-lazy-loaded');
       });
 
diff --git a/spec/frontend/members/index_spec.js b/spec/frontend/members/index_spec.js
index 251a8b0b774..efabe54f238 100644
--- a/spec/frontend/members/index_spec.js
+++ b/spec/frontend/members/index_spec.js
@@ -24,7 +24,7 @@ describe('initMembersApp', () => {
 
   beforeEach(() => {
     el = document.createElement('div');
-    el.dataset.membersData = dataAttribute;
+    el.setAttribute('data-members-data', dataAttribute);
 
     window.gon = { current_user_id: 123 };
   });
diff --git a/spec/frontend/members/utils_spec.js b/spec/frontend/members/utils_spec.js
index b0c9459ff4f..a157cfa1c1d 100644
--- a/spec/frontend/members/utils_spec.js
+++ b/spec/frontend/members/utils_spec.js
@@ -256,7 +256,7 @@ describe('Members Utils', () => {
 
     beforeEach(() => {
       el = document.createElement('div');
-      el.dataset.membersData = dataAttribute;
+      el.setAttribute('data-members-data', dataAttribute);
     });
 
     afterEach(() => {
diff --git a/spec/frontend/notebook/cells/markdown_spec.js b/spec/frontend/notebook/cells/markdown_spec.js
index de415b5bfe0..7dc6f90d202 100644
--- a/spec/frontend/notebook/cells/markdown_spec.js
+++ b/spec/frontend/notebook/cells/markdown_spec.js
@@ -78,8 +78,8 @@ describe('Markdown component', () => {
     });
 
     await nextTick();
-    expect(findLink().dataset.remote).toBeUndefined();
-    expect(findLink().dataset.type).toBeUndefined();
+    expect(findLink().getAttribute('data-remote')).toBe(null);
+    expect(findLink().getAttribute('data-type')).toBe(null);
   });
 
   describe('When parsing images', () => {
diff --git a/spec/frontend/notes/stores/actions_spec.js b/spec/frontend/notes/stores/actions_spec.js
index 38f29ac2559..4ecfbc5de1f 100644
--- a/spec/frontend/notes/stores/actions_spec.js
+++ b/spec/frontend/notes/stores/actions_spec.js
@@ -404,13 +404,13 @@ describe('Actions Notes Store', () => {
     beforeEach(() => {
       axiosMock.onDelete(endpoint).replyOnce(200, {});
 
-      document.body.dataset.page = '';
+      document.body.setAttribute('data-page', '');
     });
 
     afterEach(() => {
       axiosMock.restore();
 
-      document.body.dataset.page = '';
+      document.body.setAttribute('data-page', '');
     });
 
     it('commits DELETE_NOTE and dispatches updateMergeRequestWidget', () => {
@@ -440,7 +440,7 @@ describe('Actions Notes Store', () => {
     it('dispatches removeDiscussionsFromDiff on merge request page', () => {
       const note = { path: endpoint, id: 1 };
 
-      document.body.dataset.page = 'projects:merge_requests:show';
+      document.body.setAttribute('data-page', 'projects:merge_requests:show');
 
       return testAction(
         actions.removeNote,
@@ -473,13 +473,13 @@ describe('Actions Notes Store', () => {
     beforeEach(() => {
       axiosMock.onDelete(endpoint).replyOnce(200, {});
 
-      document.body.dataset.page = '';
+      document.body.setAttribute('data-page', '');
     });
 
     afterEach(() => {
       axiosMock.restore();
 
-      document.body.dataset.page = '';
+      document.body.setAttribute('data-page', '');
     });
 
     it('dispatches removeNote', () => {
diff --git a/spec/frontend/performance_bar/index_spec.js b/spec/frontend/performance_bar/index_spec.js
index 2da176dbfe4..008961bf709 100644
--- a/spec/frontend/performance_bar/index_spec.js
+++ b/spec/frontend/performance_bar/index_spec.js
@@ -17,11 +17,11 @@ describe('performance bar wrapper', () => {
     performance.getEntriesByType = jest.fn().mockReturnValue([]);
 
     peekWrapper.setAttribute('id', 'js-peek');
-    peekWrapper.dataset.env = 'development';
-    peekWrapper.dataset.requestId = '123';
-    peekWrapper.dataset.peekUrl = '/-/peek/results';
-    peekWrapper.dataset.statsUrl = 'https://log.gprd.gitlab.net/app/dashboards#/view/';
-    peekWrapper.dataset.profileUrl = '?lineprofiler=true';
+    peekWrapper.setAttribute('data-env', 'development');
+    peekWrapper.setAttribute('data-request-id', '123');
+    peekWrapper.setAttribute('data-peek-url', '/-/peek/results');
+    peekWrapper.setAttribute('data-stats-url', 'https://log.gprd.gitlab.net/app/dashboards#/view/');
+    peekWrapper.setAttribute('data-profile-url', '?lineprofiler=true');
 
     mock = new MockAdapter(axios);
 
diff --git a/spec/frontend/search_autocomplete_spec.js b/spec/frontend/search_autocomplete_spec.js
index 266f047e9dc..4639552b4d3 100644
--- a/spec/frontend/search_autocomplete_spec.js
+++ b/spec/frontend/search_autocomplete_spec.js
@@ -53,7 +53,7 @@ describe('Search autocomplete dropdown', () => {
   };
 
   const disableProjectIssues = () => {
-    document.querySelector('.js-search-project-options').dataset.issuesDisabled = true;
+    document.querySelector('.js-search-project-options').setAttribute('data-issues-disabled', true);
   };
 
   // Mock `gl` object in window for dashboard specific page. App code will need it.
diff --git a/spec/frontend/user_popovers_spec.js b/spec/frontend/user_popovers_spec.js
index 1544fed5240..2c3db36d7e6 100644
--- a/spec/frontend/user_popovers_spec.js
+++ b/spec/frontend/user_popovers_spec.js
@@ -22,7 +22,7 @@ describe('User Popovers', () => {
     const link = document.createElement('a');
 
     link.classList.add('js-user-link');
-    link.dataset.user = '1';
+    link.setAttribute('data-user', '1');
 
     return link;
   };
diff --git a/spec/frontend/users_select/test_helper.js b/spec/frontend/users_select/test_helper.js
index 9231e38ea90..59edde48eab 100644
--- a/spec/frontend/users_select/test_helper.js
+++ b/spec/frontend/users_select/test_helper.js
@@ -95,10 +95,10 @@ export const setAssignees = (...users) => {
       const input = document.createElement('input');
       input.name = 'merge_request[assignee_ids][]';
       input.value = user.id.toString();
-      input.dataset.avatarUrl = user.avatar_url;
-      input.dataset.name = user.name;
-      input.dataset.username = user.username;
-      input.dataset.canMerge = user.can_merge;
+      input.setAttribute('data-avatar-url', user.avatar_url);
+      input.setAttribute('data-name', user.name);
+      input.setAttribute('data-username', user.username);
+      input.setAttribute('data-can-merge', user.can_merge);
       return input;
     }),
   );
diff --git a/spec/frontend/vue_mr_widget/components/states/mr_widget_merged_spec.js b/spec/frontend/vue_mr_widget/components/states/mr_widget_merged_spec.js
index 29ee7e0010f..8efc4d84624 100644
--- a/spec/frontend/vue_mr_widget/components/states/mr_widget_merged_spec.js
+++ b/spec/frontend/vue_mr_widget/components/states/mr_widget_merged_spec.js
@@ -193,7 +193,9 @@ describe('MRWidgetMerged', () => {
 
   it('shows button to copy commit SHA to clipboard', () => {
     expect(selectors.copyMergeShaButton).not.toBe(null);
-    expect(selectors.copyMergeShaButton.dataset.clipboardText).toBe(vm.mr.mergeCommitSha);
+    expect(selectors.copyMergeShaButton.getAttribute('data-clipboard-text')).toBe(
+      vm.mr.mergeCommitSha,
+    );
   });
 
   it('hides button to copy commit SHA if SHA does not exist', async () => {
diff --git a/spec/frontend/vue_mr_widget/mr_widget_options_spec.js b/spec/frontend/vue_mr_widget/mr_widget_options_spec.js
index d134877e584..a8c55c2c735 100644
--- a/spec/frontend/vue_mr_widget/mr_widget_options_spec.js
+++ b/spec/frontend/vue_mr_widget/mr_widget_options_spec.js
@@ -424,7 +424,7 @@ describe('MrWidgetOptions', () => {
         beforeEach(() => {
           const favicon = document.createElement('link');
           favicon.setAttribute('id', 'favicon');
-          favicon.dataset.originalHref = faviconDataUrl;
+          favicon.setAttribute('data-original-href', faviconDataUrl);
           document.body.appendChild(favicon);
 
           faviconElement = document.getElementById('favicon');
diff --git a/spec/frontend_integration/ide/helpers/ide_helper.js b/spec/frontend_integration/ide/helpers/ide_helper.js
index 20a1e5aceb2..5253560c655 100644
--- a/spec/frontend_integration/ide/helpers/ide_helper.js
+++ b/spec/frontend_integration/ide/helpers/ide_helper.js
@@ -46,14 +46,14 @@ export const findMonacoDiffEditor = () =>
 
 export const findAndSetEditorValue = async (value) => {
   const editor = await findMonacoEditor();
-  const { uri } = editor.dataset;
+  const uri = editor.getAttribute('data-uri');
 
   monacoEditor.getModel(uri).setValue(value);
 };
 
 export const getEditorValue = async () => {
   const editor = await findMonacoEditor();
-  const { uri } = editor.dataset;
+  const uri = editor.getAttribute('data-uri');
 
   return monacoEditor.getModel(uri).getValue();
 };