summaryrefslogtreecommitdiff
path: root/spec/frontend/vue_shared
diff options
context:
space:
mode:
authorGitLab Bot <gitlab-bot@gitlab.com>2020-04-07 18:09:19 +0000
committerGitLab Bot <gitlab-bot@gitlab.com>2020-04-07 18:09:19 +0000
commit3290d46655f07d7ae3dca788d6df9f326972ffd8 (patch)
tree0d24713e1592cdd3583257f14a52d46a22539ed1 /spec/frontend/vue_shared
parentc6b3ec3f56fa32a0e0ed3de0d0878d25f1adaddf (diff)
downloadgitlab-ce-3290d46655f07d7ae3dca788d6df9f326972ffd8.tar.gz
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'spec/frontend/vue_shared')
-rw-r--r--spec/frontend/vue_shared/components/local_storage_sync_spec.js128
1 files changed, 128 insertions, 0 deletions
diff --git a/spec/frontend/vue_shared/components/local_storage_sync_spec.js b/spec/frontend/vue_shared/components/local_storage_sync_spec.js
new file mode 100644
index 00000000000..5470171a21e
--- /dev/null
+++ b/spec/frontend/vue_shared/components/local_storage_sync_spec.js
@@ -0,0 +1,128 @@
+import { shallowMount } from '@vue/test-utils';
+import LocalStorageSync from '~/vue_shared/components/local_storage_sync.vue';
+
+describe('Local Storage Sync', () => {
+ let wrapper;
+
+ const createComponent = ({ props = {}, slots = {} } = {}) => {
+ wrapper = shallowMount(LocalStorageSync, {
+ propsData: props,
+ slots,
+ });
+ };
+
+ afterEach(() => {
+ wrapper.destroy();
+ wrapper = null;
+ localStorage.clear();
+ });
+
+ it('is a renderless component', () => {
+ const html = '<div class="test-slot"></div>';
+ createComponent({
+ props: {
+ storageKey: 'key',
+ },
+ slots: {
+ default: html,
+ },
+ });
+
+ expect(wrapper.html()).toBe(html);
+ });
+
+ describe('localStorage empty', () => {
+ const storageKey = 'issue_list_order';
+
+ it('does not emit input event', () => {
+ createComponent({
+ props: {
+ storageKey,
+ value: 'ascending',
+ },
+ });
+
+ expect(wrapper.emitted('input')).toBeFalsy();
+ });
+
+ it('saves updated value to localStorage', () => {
+ createComponent({
+ props: {
+ storageKey,
+ value: 'ascending',
+ },
+ });
+
+ const newValue = 'descending';
+ wrapper.setProps({
+ value: newValue,
+ });
+
+ return wrapper.vm.$nextTick().then(() => {
+ expect(localStorage.getItem(storageKey)).toBe(newValue);
+ });
+ });
+
+ it('does not save default value', () => {
+ const value = 'ascending';
+
+ createComponent({
+ props: {
+ storageKey,
+ value,
+ },
+ });
+
+ expect(localStorage.getItem(storageKey)).toBe(null);
+ });
+ });
+
+ describe('localStorage has saved value', () => {
+ const storageKey = 'issue_list_order_by';
+ const savedValue = 'last_updated';
+
+ beforeEach(() => {
+ localStorage.setItem(storageKey, savedValue);
+ });
+
+ it('emits input event with saved value', () => {
+ createComponent({
+ props: {
+ storageKey,
+ value: 'ascending',
+ },
+ });
+
+ expect(wrapper.emitted('input')[0][0]).toBe(savedValue);
+ });
+
+ it('does not overwrite localStorage with prop value', () => {
+ createComponent({
+ props: {
+ storageKey,
+ value: 'created',
+ },
+ });
+
+ expect(localStorage.getItem(storageKey)).toBe(savedValue);
+ });
+
+ it('updating the value updates localStorage', () => {
+ createComponent({
+ props: {
+ storageKey,
+ value: 'created',
+ },
+ });
+
+ const newValue = 'last_updated';
+ wrapper.setProps({
+ value: newValue,
+ });
+
+ return wrapper.vm.$nextTick().then(() => {
+ expect(localStorage.getItem(storageKey)).toBe(newValue);
+ });
+ });
+ });
+});