Commit 6d478b7c authored by Rishabh Gupta's avatar Rishabh Gupta Committed by Arturo Herrero

Use prefix js- to class names

This indicates that some JS depends on this element.
parent 25f890fd
...@@ -111,7 +111,7 @@ Sidebar.prototype.toggleTodo = function (e) { ...@@ -111,7 +111,7 @@ Sidebar.prototype.toggleTodo = function (e) {
}; };
Sidebar.prototype.sidebarCollapseClicked = function (e) { Sidebar.prototype.sidebarCollapseClicked = function (e) {
if ($(e.currentTarget).hasClass('dont-change-state')) { if ($(e.currentTarget).hasClass('js-dont-change-state')) {
return; return;
} }
const sidebar = e.data; const sidebar = e.data;
......
...@@ -41,7 +41,7 @@ export default { ...@@ -41,7 +41,7 @@ export default {
computed: { computed: {
buttonClasses() { buttonClasses() {
return this.collapsed return this.collapsed
? 'btn-blank btn-todo sidebar-collapsed-icon dont-change-state' ? 'btn-blank btn-todo sidebar-collapsed-icon js-dont-change-state'
: 'gl-button btn btn-default btn-todo issuable-header-btn float-right'; : 'gl-button btn btn-default btn-todo issuable-header-btn float-right';
}, },
buttonLabel() { buttonLabel() {
......
...@@ -62,7 +62,7 @@ export default { ...@@ -62,7 +62,7 @@ export default {
<div> <div>
<clipboard-button <clipboard-button
v-if="!isLoading" v-if="!isLoading"
css-class="sidebar-collapsed-icon dont-change-state gl-rounded-0! gl-hover-bg-transparent" css-class="sidebar-collapsed-icon js-dont-change-state gl-rounded-0! gl-hover-bg-transparent"
v-bind="clipboardProps" v-bind="clipboardProps"
/> />
......
...@@ -75,7 +75,7 @@ ...@@ -75,7 +75,7 @@
#js-reference-entry-point #js-reference-entry-point
- if issuable_type == 'merge_request' - if issuable_type == 'merge_request'
.sub-block.js-sidebar-source-branch .sub-block.js-sidebar-source-branch
.sidebar-collapsed-icon.dont-change-state .sidebar-collapsed-icon.js-dont-change-state
= clipboard_button(text: source_branch, title: _('Copy branch name'), placement: "left", boundary: 'viewport') = clipboard_button(text: source_branch, title: _('Copy branch name'), placement: "left", boundary: 'viewport')
.gl-display-flex.gl-align-items-center.gl-justify-content-space-between.gl-mb-2.hide-collapsed .gl-display-flex.gl-align-items-center.gl-justify-content-space-between.gl-mb-2.hide-collapsed
%span.gl-overflow-hidden.gl-text-overflow-ellipsis.gl-white-space-nowrap %span.gl-overflow-hidden.gl-text-overflow-ellipsis.gl-white-space-nowrap
......
...@@ -161,7 +161,7 @@ ...@@ -161,7 +161,7 @@
- milestone_ref = milestone.try(:to_reference, full: true) - milestone_ref = milestone.try(:to_reference, full: true)
- if milestone_ref.present? - if milestone_ref.present?
.block.reference .block.reference
.sidebar-collapsed-icon.dont-change-state .sidebar-collapsed-icon.js-dont-change-state
= clipboard_button(text: milestone_ref, title: s_('MilestoneSidebar|Copy reference'), placement: "left", boundary: 'viewport') = clipboard_button(text: milestone_ref, title: s_('MilestoneSidebar|Copy reference'), placement: "left", boundary: 'viewport')
.cross-project-reference.hide-collapsed .cross-project-reference.hide-collapsed
%span.gl-display-inline-block.gl-text-truncate %span.gl-display-inline-block.gl-text-truncate
......
...@@ -27,7 +27,7 @@ describe('SidebarTodo', () => { ...@@ -27,7 +27,7 @@ describe('SidebarTodo', () => {
it.each` it.each`
state | classes state | classes
${false} | ${['gl-button', 'btn', 'btn-default', 'btn-todo', 'issuable-header-btn', 'float-right']} ${false} | ${['gl-button', 'btn', 'btn-default', 'btn-todo', 'issuable-header-btn', 'float-right']}
${true} | ${['btn-blank', 'btn-todo', 'sidebar-collapsed-icon', 'dont-change-state']} ${true} | ${['btn-blank', 'btn-todo', 'sidebar-collapsed-icon', 'js-dont-change-state']}
`('returns todo button classes for when `collapsed` prop is `$state`', ({ state, classes }) => { `('returns todo button classes for when `collapsed` prop is `$state`', ({ state, classes }) => {
createComponent({ collapsed: state }); createComponent({ collapsed: state });
expect(wrapper.find('button').classes()).toStrictEqual(classes); expect(wrapper.find('button').classes()).toStrictEqual(classes);
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment