Commit a4c18163 authored by Derek Knox's avatar Derek Knox Committed by Denys Mishunov

Update PublishToolbar with GlButton loading flag

parent 9056f109
<script>
import { GlButton, GlLoadingIcon } from '@gitlab/ui';
import { GlButton } from '@gitlab/ui';
export default {
components: {
GlButton,
GlLoadingIcon,
},
props: {
returnUrl: {
......@@ -26,14 +25,18 @@ export default {
};
</script>
<template>
<div class="d-flex bg-light border-top justify-content-between align-items-center py-3 px-4">
<gl-loading-icon :class="{ invisible: !savingChanges }" size="md" />
<div class="d-flex bg-light border-top justify-content-end align-items-center py-3 px-4">
<div>
<gl-button v-if="returnUrl" ref="returnUrlLink" :href="returnUrl">{{
s__('StaticSiteEditor|Return to site')
}}</gl-button>
<gl-button variant="success" :disabled="!saveable || savingChanges" @click="$emit('submit')">
{{ __('Submit Changes') }}
<gl-button
variant="success"
:disabled="!saveable"
:loading="savingChanges"
@click="$emit('submit')"
>
<span>{{ __('Submit Changes') }}</span>
</gl-button>
</div>
</div>
......
import { shallowMount } from '@vue/test-utils';
import { GlButton, GlLoadingIcon } from '@gitlab/ui';
import { GlButton } from '@gitlab/ui';
import PublishToolbar from '~/static_site_editor/components/publish_toolbar.vue';
......@@ -19,7 +19,6 @@ describe('Static Site Editor Toolbar', () => {
const findReturnUrlLink = () => wrapper.find({ ref: 'returnUrlLink' });
const findSaveChangesButton = () => wrapper.find(GlButton);
const findLoadingIndicator = () => wrapper.find(GlLoadingIcon);
beforeEach(() => {
buildWrapper();
......@@ -37,8 +36,8 @@ describe('Static Site Editor Toolbar', () => {
expect(findSaveChangesButton().attributes('disabled')).toBe('true');
});
it('does not display saving changes indicator', () => {
expect(findLoadingIndicator().classes()).toContain('invisible');
it('does not render the Submit Changes button with a loader', () => {
expect(findSaveChangesButton().props('loading')).toBe(false);
});
it('does not render returnUrl link', () => {
......@@ -62,15 +61,11 @@ describe('Static Site Editor Toolbar', () => {
describe('when saving changes', () => {
beforeEach(() => {
buildWrapper({ saveable: true, savingChanges: true });
buildWrapper({ savingChanges: true });
});
it('disables Submit Changes button', () => {
expect(findSaveChangesButton().attributes('disabled')).toBe('true');
});
it('displays saving changes indicator', () => {
expect(findLoadingIndicator().classes()).not.toContain('invisible');
it('renders the Submit Changes button with a loading indicator', () => {
expect(findSaveChangesButton().props('loading')).toBe(true);
});
});
......
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