Skip to content

G
gitlab-ce
Commit 8643eac2 authored by Nicolò Maria Mezzopera's avatar Nicolò Maria Mezzopera
Browse files
Options

Merge branch 'leipert-migrate-keyboards-help-to-vue' into 'master' 

Move keyboard shortcut help modal to Vue

See merge request gitlab-org/gitlab!41800
parents f82bed31 d5b98c93
Hide whitespace changes
Inline Side-by-side
Showing with 559 additions and 408 deletions
.haml-lint_todo.yml
View file @ 8643eac2
......@@ -109,7 +109,6 @@ linters:
- 'app/views/groups/runners/edit.html.haml'
- 'app/views/groups/settings/_advanced.html.haml'
- 'app/views/groups/settings/_lfs.html.haml'
- 'app/views/help/_shortcuts.html.haml'
- 'app/views/help/index.html.haml'
- 'app/views/help/instance_configuration.html.haml'
- 'app/views/help/instance_configuration/_gitlab_ci.html.haml'
......
app/assets/javascripts/behaviors/shortcuts/shortcuts.js
View file @ 8643eac2
......@@ -3,12 +3,11 @@ import Cookies from 'js-cookie';
import Mousetrap from 'mousetrap';
import Vue from 'vue';
import { flatten } from 'lodash';
import { parseBoolean, getCspNonceValue } from '~/lib/utils/common_utils';
import axios from '../../lib/utils/axios_utils';
import { refreshCurrentPage, visitUrl } from '../../lib/utils/url_utility';
import findAndFollowLink from '../../lib/utils/navigation_utility';
import { refreshCurrentPage, visitUrl } from '~/lib/utils/url_utility';
import findAndFollowLink from '~/lib/utils/navigation_utility';
import { parseBoolean } from '~/lib/utils/common_utils';
import { disableShortcuts, shouldDisableShortcuts } from './shortcuts_toggle';
import ShortcutsToggle from './shortcuts_toggle.vue';
import { keysFor, TOGGLE_PERFORMANCE_BAR, TOGGLE_CANARY } from './keybindings';
const defaultStopCallback = Mousetrap.prototype.stopCallback;
......@@ -20,15 +19,6 @@ Mousetrap.prototype.stopCallback = function customStopCallback(e, element, combo
return defaultStopCallback.call(this, e, element, combo);
};
function initToggleButton() {
return new Vue({
el: document.querySelector('.js-toggle-shortcuts'),
render(createElement) {
return createElement(ShortcutsToggle);
},
});
}
/**
* The key used to save and fetch the local Mousetrap instance
* attached to a `<textarea>` element using `jQuery.data`
......@@ -65,7 +55,8 @@ function getToolbarBtnToShortcutsMap($textarea) {
export default class Shortcuts {
constructor() {
this.onToggleHelp = this.onToggleHelp.bind(this);
this.enabledHelp = [];
this.helpModalElement = null;
this.helpModalVueInstance = null;
Mousetrap.bind('?', this.onToggleHelp);
Mousetrap.bind('s', Shortcuts.focusSearch);
......@@ -107,11 +98,33 @@ export default class Shortcuts {
}
onToggleHelp(e) {
if (e.preventDefault) {
if (e?.preventDefault) {
e.preventDefault();
}
Shortcuts.toggleHelp(this.enabledHelp);
if (this.helpModalElement && this.helpModalVueInstance) {
this.helpModalVueInstance.$destroy();
this.helpModalElement.remove();
this.helpModalElement = null;
this.helpModalVueInstance = null;
} else {
this.helpModalElement = document.createElement('div');
document.body.append(this.helpModalElement);
this.helpModalVueInstance = new Vue({
el: this.helpModalElement,
components: {
ShortcutsHelp: () => import('./shortcuts_help.vue'),
},
render: (createElement) => {
return createElement('shortcuts-help', {
on: {
hidden: this.onToggleHelp,
},
});
},
});
}
}
static onTogglePerfBar(e) {
......@@ -144,34 +157,6 @@ export default class Shortcuts {
$(document).triggerHandler('markdown-preview:toggle', [e]);
}
static toggleHelp(location) {
const $modal = $('#modal-shortcuts');
if ($modal.length) {
$modal.modal('toggle');
return null;
}
return axios
.get(gon.shortcuts_path, {
responseType: 'text',
})
.then(({ data }) => {
$.globalEval(data, { nonce: getCspNonceValue() });
if (location && location.length > 0) {
const results = [];
for (let i = 0, len = location.length; i < len; i += 1) {
results.push($(location[i]).show());
}
return results;
}
return $('.js-more-help-button').remove();
})
.then(initToggleButton);
}
focusFilter(e) {
if (!this.filterInput) {
this.filterInput = $('input[type=search]', '.nav-controls');
......
app/assets/javascripts/behaviors/shortcuts/shortcuts_help.vue 0 → 100644
View file @ 8643eac2
<script>
/* eslint-disable @gitlab/vue-require-i18n-strings */
import { GlIcon, GlModal } from '@gitlab/ui';
import ShortcutsToggle from './shortcuts_toggle.vue';
export default {
components: {
GlIcon,
GlModal,
ShortcutsToggle,
},
computed: {
ctrlCharacter() {
return window.gl.client.isMac ? '⌘' : 'ctrl';
},
onDotCom() {
return window.gon.dot_com;
},
},
};
</script>
<template>
<gl-modal
modal-id="keyboard-shortcut-modal"
size="lg"
data-testid="modal-shortcuts"
:visible="true"
:hide-footer="true"
@hidden="$emit('hidden')"
>
<template #modal-title>
<shortcuts-toggle />
</template>
<div class="row">
<div class="col-lg-4">
<table class="shortcut-mappings text-2">
<tbody>
<tr>
<th></th>
<th>{{ __('Global Shortcuts') }}</th>
</tr>
<tr>
<td class="shortcut">
<kbd>?</kbd>
</td>
<td>{{ __('Toggle this dialog') }}</td>
</tr>
<tr>
<td class="shortcut">
<kbd>shift p</kbd>
</td>
<td>{{ __('Go to your projects') }}</td>
</tr>
<tr>
<td class="shortcut">
<kbd>shift g</kbd>
</td>
<td>{{ __('Go to your groups') }}</td>
</tr>
<tr>
<td class="shortcut">
<kbd>shift a</kbd>
</td>
<td>{{ __('Go to the activity feed') }}</td>
</tr>
<tr>
<td class="shortcut">
<kbd>shift l</kbd>
</td>
<td>{{ __('Go to the milestone list') }}</td>
</tr>
<tr>
<td class="shortcut">
<kbd>shift s</kbd>
</td>
<td>{{ __('Go to your snippets') }}</td>
</tr>
<tr>
<td class="shortcut">
<kbd>s</kbd>
/
<kbd>/</kbd>
</td>
<td>{{ __('Start search') }}</td>
</tr>
<tr>
<td class="shortcut">
<kbd>shift i</kbd>
</td>
<td>{{ __('Go to your issues') }}</td>
</tr>
<tr>
<td class="shortcut">
<kbd>shift m</kbd>
</td>
<td>{{ __('Go to your merge requests') }}</td>
</tr>
<tr>
<td class="shortcut">
<kbd>shift t</kbd>
</td>
<td>{{ __('Go to your To-Do list') }}</td>
</tr>
<tr>
<td class="shortcut">
<kbd>p</kbd>
<kbd>b</kbd>
</td>
<td>{{ __('Toggle the Performance Bar') }}</td>
</tr>
<tr v-if="onDotCom">
<td class="shortcut">
<kbd>g</kbd>
<kbd>x</kbd>
</td>
<td>{{ __('Toggle GitLab Next') }}</td>
</tr>
</tbody>
<tbody>
<tr>
<th></th>
<th>{{ __('Editing') }}</th>
</tr>
<tr>
<td class="shortcut">
<kbd>{{ ctrlCharacter }} shift p</kbd>
</td>
<td>{{ __('Toggle Markdown preview') }}</td>
</tr>
<tr>
<td class="shortcut">
<kbd>
<gl-icon name="arrow-up" />
</kbd>
</td>
<td>
{{ __('Edit your most recent comment in a thread (from an empty textarea)') }}
</td>
</tr>
</tbody>
<tbody>
<tr>
<th></th>
<th>{{ __('Wiki') }}</th>
</tr>
<tr>
<td class="shortcut">
<kbd>e</kbd>
</td>
<td>{{ __('Edit wiki page') }}</td>
</tr>
</tbody>
<tbody>
<tr>
<th></th>
<th>{{ __('Repository Graph') }}</th>
</tr>
<tr>
<td class="shortcut">
<kbd>
<gl-icon name="arrow-left" />
</kbd>
/
<kbd>h</kbd>
</td>
<td>{{ __('Scroll left') }}</td>
</tr>
<tr>
<td class="shortcut">
<kbd>
<gl-icon name="arrow-right" />
</kbd>
/
<kbd>l</kbd>
</td>
<td>{{ __('Scroll right') }}</td>
</tr>
<tr>
<td class="shortcut">
<kbd>
<gl-icon name="arrow-up" />
</kbd>
/
<kbd>k</kbd>
</td>
<td>{{ __('Scroll up') }}</td>
</tr>
<tr>
<td class="shortcut">
<kbd>
<gl-icon name="arrow-down" />
</kbd>
/
<kbd>j</kbd>
</td>
<td>{{ __('Scroll down') }}</td>
</tr>
<tr>
<td class="shortcut">
<kbd>
shift
<gl-icon name="arrow-up" />
/ k
</kbd>
</td>
<td>{{ __('Scroll to top') }}</td>
</tr>
<tr>
<td class="shortcut">
<kbd>
shift
<gl-icon name="arrow-down" />
/ j
</kbd>
</td>
<td>{{ __('Scroll to bottom') }}</td>
</tr>
</tbody>
</table>
</div>
<div class="col-lg-4">
<table class="shortcut-mappings text-2">
<tbody>
<tr>
<th></th>
<th>{{ __('Project') }}</th>
</tr>
<tr>
<td class="shortcut">
<kbd>g</kbd>
<kbd>p</kbd>
</td>
<td>{{ __("Go to the project's overview page") }}</td>
</tr>
<tr>
<td class="shortcut">
<kbd>g</kbd>
<kbd>v</kbd>
</td>
<td>{{ __("Go to the project's activity feed") }}</td>
</tr>
<tr>
<td class="shortcut">
<kbd>g</kbd>
<kbd>r</kbd>
</td>
<td>{{ __('Go to releases') }}</td>
</tr>
<tr>
<td class="shortcut">
<kbd>g</kbd>
<kbd>f</kbd>
</td>
<td>{{ __('Go to files') }}</td>
</tr>
<tr>
<td class="shortcut">
<kbd>t</kbd>
</td>
<td>{{ __('Go to find file') }}</td>
</tr>
<tr>
<td class="shortcut">
<kbd>g</kbd>
<kbd>c</kbd>
</td>
<td>{{ __('Go to commits') }}</td>
</tr>
<tr>
<td class="shortcut">
<kbd>g</kbd>
<kbd>n</kbd>
</td>
<td>{{ __('Go to repository graph') }}</td>
</tr>
<tr>
<td class="shortcut">
<kbd>g</kbd>
<kbd>d</kbd>
</td>
<td>{{ __('Go to repository charts') }}</td>
</tr>
<tr>
<td class="shortcut">
<kbd>g</kbd>
<kbd>i</kbd>
</td>
<td>{{ __('Go to issues') }}</td>
</tr>
<tr>
<td class="shortcut">
<kbd>i</kbd>
</td>
<td>{{ __('New issue') }}</td>
</tr>
<tr>
<td class="shortcut">
<kbd>g</kbd>
<kbd>b</kbd>
</td>
<td>{{ __('Go to issue boards') }}</td>
</tr>
<tr>
<td class="shortcut">
<kbd>g</kbd>
<kbd>m</kbd>
</td>
<td>{{ __('Go to merge requests') }}</td>
</tr>
<tr>
<td class="shortcut">
<kbd>g</kbd>
<kbd>j</kbd>
</td>
<td>{{ __('Go to jobs') }}</td>
</tr>
<tr>
<td class="shortcut">
<kbd>g</kbd>
<kbd>l</kbd>
</td>
<td>{{ __('Go to metrics') }}</td>
</tr>
<tr>
<td class="shortcut">
<kbd>g</kbd>
<kbd>e</kbd>
</td>
<td>{{ __('Go to environments') }}</td>
</tr>
<tr>
<td class="shortcut">
<kbd>g</kbd>
<kbd>k</kbd>
</td>
<td>{{ __('Go to kubernetes') }}</td>
</tr>
<tr>
<td class="shortcut">
<kbd>g</kbd>
<kbd>s</kbd>
</td>
<td>{{ __('Go to snippets') }}</td>
</tr>
<tr>
<td class="shortcut">
<kbd>g</kbd>
<kbd>w</kbd>
</td>
<td>{{ __('Go to wiki') }}</td>
</tr>
</tbody>
<tbody>
<tr>
<th></th>
<th>{{ __('Project Files') }}</th>
</tr>
<tr>
<td class="shortcut">
<kbd>
<gl-icon name="arrow-up" />
</kbd>
</td>
<td>{{ __('Move selection up') }}</td>
</tr>
<tr>
<td class="shortcut">
<kbd>
<gl-icon name="arrow-down" />
</kbd>
</td>
<td>{{ __('Move selection down') }}</td>
</tr>
<tr>
<td class="shortcut">
<kbd>enter</kbd>
</td>
<td>{{ __('Open Selection') }}</td>
</tr>
<tr>
<td class="shortcut">
<kbd>esc</kbd>
</td>
<td>{{ __('Go back (while searching for files)') }}</td>
</tr>
<tr>
<td class="shortcut">
<kbd>y</kbd>
</td>
<td>{{ __('Go to file permalink (while viewing a file)') }}</td>
</tr>
</tbody>
</table>
</div>
<div class="col-lg-4">
<table class="shortcut-mappings text-2">
<tbody>
<tr>
<th></th>
<th>{{ __('Epics, Issues, and Merge Requests') }}</th>
</tr>
<tr>
<td class="shortcut">
<kbd>r</kbd>
</td>
<td>{{ __('Comment/Reply (quoting selected text)') }}</td>
</tr>
<tr>
<td class="shortcut">
<kbd>e</kbd>
</td>
<td>{{ __('Edit description') }}</td>
</tr>
<tr>
<td class="shortcut">
<kbd>l</kbd>
</td>
<td>{{ __('Change label') }}</td>
</tr>
</tbody>
<tbody>
<tr>
<th></th>
<th>{{ __('Issues and Merge Requests') }}</th>
</tr>
<tr>
<td class="shortcut">
<kbd>a</kbd>
</td>
<td>{{ __('Change assignee') }}</td>
</tr>
<tr>
<td class="shortcut">
<kbd>m</kbd>
</td>
<td>{{ __('Change milestone') }}</td>
</tr>
</tbody>
<tbody>
<tr>
<th></th>
<th>{{ __('Merge Requests') }}</th>
</tr>
<tr>
<td class="shortcut">
<kbd>]</kbd>
/
<kbd>j</kbd>
</td>
<td>{{ __('Next file in diff') }}</td>
</tr>
<tr>
<td class="shortcut">
<kbd>[</kbd>
/
<kbd>k</kbd>
</td>
<td>{{ __('Previous file in diff') }}</td>
</tr>
<tr>
<td class="shortcut">
<kbd>{{ ctrlCharacter }} p</kbd>
</td>
<td>{{ __('Go to file') }}</td>
</tr>
<tr>
<td class="shortcut">
<kbd>n</kbd>
</td>
<td>{{ __('Next unresolved discussion') }}</td>
</tr>
<tr>
<td class="shortcut">
<kbd>p</kbd>
</td>
<td>{{ __('Previous unresolved discussion') }}</td>
</tr>
<tr>
<td class="shortcut">
<kbd>b</kbd>
</td>
<td>{{ __('Copy source branch name') }}</td>
</tr>
</tbody>
<tbody>
<tr>
<th></th>
<th>{{ __('Merge Request Commits') }}</th>
</tr>
<tr>
<td class="shortcut">
<kbd>c</kbd>
</td>
<td>{{ __('Next commit') }}</td>
</tr>
<tr>
<td class="shortcut">
<kbd>x</kbd>
</td>
<td>{{ __('Previous commit') }}</td>
</tr>
</tbody>
<tbody>
<tr>
<th></th>
<th>{{ __('Web IDE') }}</th>
</tr>
<tr>
<td class="shortcut">
<kbd>{{ ctrlCharacter }} p</kbd>
</td>
<td>{{ __('Go to file') }}</td>
</tr>
<tr>
<td class="shortcut">
<kbd>{{ ctrlCharacter }} enter</kbd>
</td>
<td>{{ __('Commit (when editing commit message)') }}</td>
</tr>
</tbody>
</table>
</div>
</div>
</gl-modal>
</template>
app/views/help/_shortcuts.html.haml deleted 100644 → 0
View file @ f82bed31
#modal-shortcuts.modal{ tabindex: -1 }
.modal-dialog.modal-lg.modal-1040
.modal-content
.modal-header
.js-toggle-shortcuts
%button.close{ type: "button", "data-dismiss": "modal", "aria-label" => _('Close') }
%span{ "aria-hidden": true } &times;
.modal-body
.row
.col-lg-4
%table.shortcut-mappings.text-2
%tbody
%tr
%th
%th= _('Global Shortcuts')
%tr
%td.shortcut
%kbd ?
%td= _('Toggle this dialog')
%tr
%td.shortcut
%kbd shift p
%td= _('Go to your projects')
%tr
%td.shortcut
%kbd shift g
%td= _('Go to your groups')
%tr
%td.shortcut
%kbd shift a
%td= _('Go to the activity feed')
%tr
%td.shortcut
%kbd shift l
%td= _('Go to the milestone list')
%tr
%td.shortcut
%kbd shift s
%td= _('Go to your snippets')
%tr
%td.shortcut
%kbd s
\/
%kbd /
%td= _('Start search')
%tr
%td.shortcut
%kbd shift i
%td= _('Go to your issues')
%tr
%td.shortcut
%kbd shift m
%td= _('Go to your merge requests')
%tr
%td.shortcut
%kbd shift t
%td= _('Go to your To-Do list')
%tr
%td.shortcut
%kbd p
%kbd b
%td= _('Toggle the Performance Bar')
- if Gitlab.com?
%tr
%td.shortcut
%kbd g
%kbd x
%td= _('Toggle GitLab Next')
%tbody
%tr
%th
%th= _('Editing')
%tr
%td.shortcut
- if browser.platform.mac?
%kbd &#8984; shift p
- else
%kbd ctrl shift p
%td= _('Toggle Markdown preview')
%tr
%td.shortcut
%kbd
= sprite_icon('arrow-up', size: 12)
%td= _('Edit your most recent comment in a thread (from an empty textarea)')
%tbody
%tr
%th
%th= _('Wiki')
%tr
%td.shortcut
%kbd e
%td= _('Edit wiki page')
%tbody
%tr
%th
%th= _('Repository Graph')
%tr
%td.shortcut
%kbd
= sprite_icon('arrow-left', size: 12)
\/
%kbd h
%td= _('Scroll left')
%tr
%td.shortcut
%kbd
= sprite_icon('arrow-right', size: 12)
\/
%kbd l
%td= _('Scroll right')
%tr
%td.shortcut
%kbd
= sprite_icon('arrow-up', size: 12)
\/
%kbd k
%td= _('Scroll up')
%tr
%td.shortcut
%kbd
= sprite_icon('arrow-down', size: 12)
\/
%kbd j
%td= _('Scroll down')
%tr
%td.shortcut
%kbd
shift
= sprite_icon('arrow-up', size: 12)
\/ k
%td= _('Scroll to top')
%tr
%td.shortcut
%kbd
shift
= sprite_icon('arrow-down', size: 12)
\/ j
%td= _('Scroll to bottom')
.col-lg-4
%table.shortcut-mappings.text-2
%tbody
%tr
%th
%th= _('Project')
%tr
%td.shortcut
%kbd g
%kbd p
%td= _('Go to the project\'s overview page')
%tr
%td.shortcut
%kbd g
%kbd v
%td= _('Go to the project\'s activity feed')
%tr
%td.shortcut
%kbd g
%kbd r
%td= _('Go to releases')
%tr
%td.shortcut
%kbd g
%kbd f
%td= _('Go to files')
%tr
%td.shortcut
%kbd t
%td= _('Go to find file')
%tr
%td.shortcut
%kbd g
%kbd c
%td= _('Go to commits')
%tr
%td.shortcut
%kbd g
%kbd n
%td= _('Go to repository graph')
%tr
%td.shortcut
%kbd g
%kbd d
%td= _('Go to repository charts')
%tr
%td.shortcut
%kbd g
%kbd i
%td= _('Go to issues')
%tr
%td.shortcut
%kbd i
%td= _('New issue')
%tr
%td.shortcut
%kbd g
%kbd b
%td= _('Go to issue boards')
%tr
%td.shortcut
%kbd g
%kbd m
%td= _('Go to merge requests')
%tr
%td.shortcut
%kbd g
%kbd j
%td= _('Go to jobs')
%tr
%td.shortcut
%kbd g
%kbd l
%td= _('Go to metrics')
%tr
%td.shortcut
%kbd g
%kbd e
%td= _('Go to environments')
%tr
%td.shortcut
%kbd g
%kbd k
%td= _('Go to kubernetes')
%tr
%td.shortcut
%kbd g
%kbd s
%td= _('Go to snippets')
%tr
%td.shortcut
%kbd g
%kbd w
%td= _('Go to wiki')
%tbody
%tr
%th
%th= _('Project Files')
%tr
%td.shortcut
%kbd
= sprite_icon('arrow-up', size: 12)
%td= _('Move selection up')
%tr
%td.shortcut
%kbd
= sprite_icon('arrow-down', size: 12)
%td= _('Move selection down')
%tr
%td.shortcut
%kbd enter
%td= _('Open Selection')
%tr
%td.shortcut
%kbd esc
%td= _('Go back (while searching for files)')
%tr
%td.shortcut
%kbd y
%td= _('Go to file permalink (while viewing a file)')
.col-lg-4
%table.shortcut-mappings.text-2
%tbody
%tr
%th
%th= _('Epics, Issues, and Merge Requests')
%tr
%td.shortcut
%kbd r
%td= _('Comment/Reply (quoting selected text)')
%tr
%td.shortcut
%kbd e
%td= _('Edit description')
%tr
%td.shortcut
%kbd l
%td= _('Change label')
%tbody
%tr
%th
%th= _('Issues and Merge Requests')
%tr
%td.shortcut
%kbd a
%td= _('Change assignee')
%tr
%td.shortcut
%kbd m
%td= _('Change milestone')
%tbody
%tr
%th
%th= _('Merge Requests')
%tr
%td.shortcut
%kbd ]
\/
%kbd j
%td= _('Next file in diff')
%tr
%td.shortcut
%kbd [
\/
%kbd k
%td= _('Previous file in diff')
%tr
%td.shortcut
- if browser.platform.mac?
%kbd &#8984; p
- else
%kbd ctrl p
%td= _('Go to file')
%tr
%td.shortcut
%kbd n
%td= _('Next unresolved discussion')
%tr
%td.shortcut
%kbd p
%td= _('Previous unresolved discussion')
%tr
%td.shortcut
%kbd b
%td= _('Copy source branch name')
%tbody
%tr
%th
%th= _('Merge Request Commits')
%tr
%td.shortcut
%kbd c
%td= _('Next commit')
%tr
%td.shortcut
%kbd x
%td= _('Previous commit')
%tbody
%tr
%th
%th= _('Web IDE')
%tr
%td.shortcut
- if browser.platform.mac?
%kbd &#8984; p
- else
%kbd ctrl p
%td= _('Go to file')
%tr
%td.shortcut
- if browser.platform.mac?
%kbd &#8984; enter
- else
%kbd ctrl enter
%td= _('Commit (when editing commit message)')
app/views/help/shortcuts.js.haml deleted 100644 → 0
View file @ f82bed31
:plain
$("body").append("#{escape_javascript(render('shortcuts'))}");
$("#modal-shortcuts").modal();
lib/gitlab/gon_helper.rb
View file @ 8643eac2
......@@ -13,7 +13,6 @@ module Gitlab
gon.asset_host = ActionController::Base.asset_host
gon.webpack_public_path = webpack_public_path
gon.relative_url_root = Gitlab.config.gitlab.relative_url_root
gon.shortcuts_path = Gitlab::Routing.url_helpers.help_page_path('shortcuts')
gon.user_color_scheme = Gitlab::ColorSchemes.for_user(current_user).css_class
if Gitlab.config.sentry.enabled
......
spec/features/help_pages_spec.rb
View file @ 8643eac2
......@@ -23,7 +23,7 @@ RSpec.describe 'Help Pages' do
it 'opens shortcuts help dialog' do
find('.js-trigger-shortcut').click
expect(page).to have_selector('#modal-shortcuts')
expect(page).to have_selector('[data-testid="modal-shortcuts"]')
end
end
end
......
spec/features/projects/user_uses_shortcuts_spec.rb
View file @ 8643eac2
......@@ -27,14 +27,13 @@ RSpec.describe 'User uses shortcuts', :js do
open_modal_shortcut_keys
# modal-shortcuts still in the DOM, but hidden
expect(find('#modal-shortcuts', visible: false)).not_to be_visible
expect(page).not_to have_selector('[data-testid="modal-shortcuts"]')
page.refresh
open_modal_shortcut_keys
# after reload, shortcuts modal doesn't exist at all until we add it
expect(page).not_to have_selector('#modal-shortcuts')
expect(page).not_to have_selector('[data-testid="modal-shortcuts"]')
end
it 're-enables shortcuts' do
......@@ -47,7 +46,7 @@ RSpec.describe 'User uses shortcuts', :js do
close_modal
open_modal_shortcut_keys
expect(find('#modal-shortcuts')).to be_visible
expect(find('[data-testid="modal-shortcuts"]')).to be_visible
end
def open_modal_shortcut_keys
......
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
GitLab Nexedi Edition | About GitLab | About Nexedi | 沪ICP备2021021310号-2 | 沪ICP备2021021310号-7