diff --git a/app/assets/javascripts/boards/components/board_top_bar.vue b/app/assets/javascripts/boards/components/board_top_bar.vue index 2b8418333a8..7fd1a934381 100644 --- a/app/assets/javascripts/boards/components/board_top_bar.vue +++ b/app/assets/javascripts/boards/components/board_top_bar.vue @@ -93,6 +93,9 @@ export default { }); return hasScope; }, + isLoading() { + return this.$apollo.queries.board.loading; + }, }, }; @@ -105,7 +108,11 @@ export default {
- + ({}), }, + isCurrentBoardLoading: { + type: Boolean, + required: false, + default: false, + }, }, data() { return { @@ -92,6 +97,9 @@ export default { boardToUse() { return this.isApolloBoard ? this.boardApollo : this.board; }, + isBoardToUseLoading() { + return this.isApolloBoard ? this.isCurrentBoardLoading : this.isBoardLoading; + }, parentType() { return this.boardType; }, @@ -301,7 +309,7 @@ export default { data-qa-selector="boards_dropdown" toggle-class="dropdown-menu-toggle" menu-class="flex-column dropdown-extended-height" - :loading="isBoardLoading" + :loading="isBoardToUseLoading" :text="boardToUse.name" @show="loadBoards" > diff --git a/app/assets/javascripts/super_sidebar/components/sidebar_menu.vue b/app/assets/javascripts/super_sidebar/components/sidebar_menu.vue index 7150f15d210..65cec94253c 100644 --- a/app/assets/javascripts/super_sidebar/components/sidebar_menu.vue +++ b/app/assets/javascripts/super_sidebar/components/sidebar_menu.vue @@ -2,7 +2,6 @@ import * as Sentry from '@sentry/browser'; import { GlBreakpointInstance, breakpoints } from '@gitlab/ui/dist/utils'; import axios from '~/lib/utils/axios_utils'; -import { s__ } from '~/locale'; import glFeatureFlagsMixin from '~/vue_shared/mixins/gl_feature_flags_mixin'; import { PANELS_WITH_PINS } from '../constants'; import NavItem from './nav_item.vue'; @@ -51,10 +50,6 @@ export default { }, }, - i18n: { - mainNavigation: s__('Navigation|Main navigation'), - }, - data() { return { showFlyoutMenus: false, @@ -164,7 +159,7 @@ export default { - +
diff --git a/app/assets/javascripts/super_sidebar/components/super_sidebar.vue b/app/assets/javascripts/super_sidebar/components/super_sidebar.vue index de53e93aad6..da1d82c1a78 100644 --- a/app/assets/javascripts/super_sidebar/components/super_sidebar.vue +++ b/app/assets/javascripts/super_sidebar/components/super_sidebar.vue @@ -2,7 +2,7 @@ import { GlButton } from '@gitlab/ui'; import { Mousetrap } from '~/lib/mousetrap'; import { keysFor, TOGGLE_SUPER_SIDEBAR } from '~/behaviors/shortcuts/keybindings'; -import { __ } from '~/locale'; +import { __, s__ } from '~/locale'; import Tracking from '~/tracking'; import { sidebarState } from '../constants'; import { isCollapsed, toggleSuperSidebarCollapsed } from '../super_sidebar_collapsed_state_manager'; @@ -29,6 +29,7 @@ export default { mixins: [Tracking.mixin()], i18n: { skipToMainContent: __('Skip to main content'), + primary: s__('Navigation|Primary'), }, inject: ['showTrialStatusWidget'], props: { @@ -111,8 +112,9 @@ export default { > {{ $options.i18n.skipToMainContent }} - + { isGroupBoard = false, isProjectBoard = false, provide = {}, + props = {}, } = {}) => { fakeApollo = createMockApollo([ [projectBoardsQuery, projectBoardsQueryHandler], @@ -100,6 +101,7 @@ describe('BoardsSelector', () => { apolloProvider: fakeApollo, propsData: { throttleDuration, + ...props, }, attachTo: document.body, provide: { @@ -307,4 +309,14 @@ describe('BoardsSelector', () => { }); }); }); + + describe('Apollo boards', () => { + it('displays loading state of dropdown while current board is being fetched', () => { + createComponent({ + props: { isCurrentBoardLoading: true }, + provide: { isApolloBoard: true }, + }); + expect(findDropdown().props('loading')).toBe(true); + }); + }); }); diff --git a/spec/frontend/super_sidebar/components/sidebar_menu_spec.js b/spec/frontend/super_sidebar/components/sidebar_menu_spec.js index 1ba4b34ada0..dd780b172f5 100644 --- a/spec/frontend/super_sidebar/components/sidebar_menu_spec.js +++ b/spec/frontend/super_sidebar/components/sidebar_menu_spec.js @@ -201,11 +201,4 @@ describe('Sidebar Menu', () => { expect(findMainMenuSeparator().exists()).toBe(false); }); }); - - describe('ARIA attributes', () => { - it('adds aria-label attribute to nav element', () => { - createWrapper(); - expect(wrapper.find('nav').attributes('aria-label')).toBe('Main navigation'); - }); - }); }); diff --git a/spec/frontend/super_sidebar/components/super_sidebar_spec.js b/spec/frontend/super_sidebar/components/super_sidebar_spec.js index 2e2dfe7e94a..7a364299c72 100644 --- a/spec/frontend/super_sidebar/components/super_sidebar_spec.js +++ b/spec/frontend/super_sidebar/components/super_sidebar_spec.js @@ -274,4 +274,11 @@ describe('SuperSidebar component', () => { expect(findTrialStatusPopover().exists()).toBe(true); }); }); + + describe('ARIA attributes', () => { + it('adds aria-label attribute to nav element', () => { + createWrapper(); + expect(wrapper.find('nav').attributes('aria-label')).toBe('Primary'); + }); + }); }); diff --git a/spec/frontend/super_sidebar/components/super_sidebar_toggle_spec.js b/spec/frontend/super_sidebar/components/super_sidebar_toggle_spec.js index 23b735c2773..5a659c2a89a 100644 --- a/spec/frontend/super_sidebar/components/super_sidebar_toggle_spec.js +++ b/spec/frontend/super_sidebar/components/super_sidebar_toggle_spec.js @@ -53,7 +53,7 @@ describe('SuperSidebarToggle component', () => { it('has aria-label attribute', () => { createWrapper(); - expect(findButton().attributes('aria-label')).toBe(__('Navigation sidebar')); + expect(findButton().attributes('aria-label')).toBe(__('Primary navigation sidebar')); }); it('is disabled when isPeek is true', () => { diff --git a/vite.config.js b/vite.config.js index fb036ae6068..6ff6cda0288 100644 --- a/vite.config.js +++ b/vite.config.js @@ -73,7 +73,13 @@ export default defineConfig({ }, plugins: [ fixedRubyPlugin, - vue(), + vue({ + template: { + compilerOptions: { + whitespace: 'preserve', + }, + }, + }), graphql(), svgLoader({ defaultImport: 'raw',