From 03f418df382ca4b924db22df7a1b0245a92f3408 Mon Sep 17 00:00:00 2001 From: Christian Cueni Date: Wed, 11 Sep 2019 14:45:31 +0200 Subject: [PATCH 1/6] Fix content list numbering --- client/src/components/ContentBlock.vue | 19 +- client/tests/unit/content-block.spec.js | 240 ++++++++++++++++++++++++ 2 files changed, 253 insertions(+), 6 deletions(-) create mode 100644 client/tests/unit/content-block.spec.js diff --git a/client/src/components/ContentBlock.vue b/client/src/components/ContentBlock.vue index f51c210b..6f85068e 100644 --- a/client/src/components/ContentBlock.vue +++ b/client/src/components/ContentBlock.vue @@ -152,8 +152,9 @@ if (content.type === 'content_list_item') { contentList = [...contentList, content] if (index === this.contentBlock.contents.length - 1) { // content is last element of contents array + let updatedContent = [...newContents, ...this.createContentListOrBlocks(contentList, startingIndex)]; startingIndex = this.updateStartingIndex(startingIndex, contentList); - return [...newContents, ...this.createContentListOrBlocks(contentList, startingIndex)]; + return updatedContent; } return newContents; } else { @@ -220,19 +221,25 @@ }]; }, updateStartingIndex(startingIndex, contentList) { - return contentList.length > 1 ? startingIndex + contentList.length : startingIndex; + return contentList.length > 0 ? startingIndex + contentList.length : startingIndex; }, removeSingleContentListItem(content, index) { // just handle the case where we have one contentlistItem ( no index like "a)"" will be shown) - if (index > 0) { + + if (index === 0) { return content; }; - let contentListIndex = content.findIndex(contentItem => contentItem.type === 'content_list'); - if (contentListIndex < 0) { + const contentLists = content.filter(contentItem => contentItem.type === 'content_list'); + if (contentLists.length !== 1) { return content; } - return [...content.slice(0, contentListIndex), ...content[contentListIndex].contents[0].value, ...content.slice(contentListIndex + 1)]; + + const listIndex = content.findIndex(contentItem => contentItem.type === 'content_list'); + if (content[listIndex].contents.length !== 1) { + return content; + } + return [...content.slice(0, listIndex), ...content[listIndex].contents[0].value, ...content.slice(listIndex + 1)]; } }, data() { diff --git a/client/tests/unit/content-block.spec.js b/client/tests/unit/content-block.spec.js new file mode 100644 index 00000000..dfde5350 --- /dev/null +++ b/client/tests/unit/content-block.spec.js @@ -0,0 +1,240 @@ +import { shallowMount, createLocalVue } from '@vue/test-utils' +import ContentBlock from '@/components/ContentBlock' +import Vuex from 'vuex' + +const localVue = createLocalVue() + +localVue.use(Vuex) + +describe('ContentBlock.vue', () => { + + let actions; + let store; + let getters; + + beforeEach(() => { + actions = {}; + getters = { + editModule: jest.fn() + }; + + store = new Vuex.Store({ + state: {}, + getters, + actions: {} + }) + }) + + it('should update index if content list has minimal length', () => { + const props = { + contentBlock: {id: 'asbd', type: 'content', contents: []}, + parent: null + }; + const wrapper = shallowMount(ContentBlock, { + propsData: props, + store, + localVue + }); + + let contentList = [1,2,3,4]; + let index = 0; + let updatedIndex = wrapper.vm.updateStartingIndex(index, contentList); + expect(updatedIndex).toEqual(contentList.length + index); + }); + + it('should not update index if content list has not minimal length', () => { + const props = { + contentBlock: {id: 'asbd', type: 'content', contents: []}, + parent: null + }; + const wrapper = shallowMount(ContentBlock, { + propsData: props, + store, + localVue + }); + + let contentList = []; + let index = 2; + let updatedIndex = wrapper.vm.updateStartingIndex(index, contentList); + expect(updatedIndex).toEqual(index); + }); + + + it('should use continuos item numbering', () => { + + const contents = [ + { + type: 'text_block' + }, + { + type: 'content_list_item', + id: 1, + contents: [] + }, + { + type: 'text_block' + }, + { + type: 'content_list_item', + id: 2, + contents: [] + }, + { + type: 'content_list_item', + id: 3, + contents: [] + }, + { + type: 'text_block' + }, + { + type: 'content_list_item', + id: 4, + contents: [] + }, + ]; + + + const props = { + contentBlock: { + id: 'asbd', + type: 'content', + contents + }, + parent: null + }; + const wrapper = shallowMount(ContentBlock, { + propsData: props, + store, + localVue + }); + + /* + expected output + [ { type: 'text_block' }, + { type: 'content_list', + contents: [ [Object] ], + id: 1, + startingIndex: 0 }, + { type: 'text_block' }, + { type: 'content_list', + contents: [ [Object], [Object] ], + id: 2, + startingIndex: 1 }, + { type: 'text_block' }, + { type: 'content_list', + contents: [ [Object] ], + id: 4, + startingIndex: 3 } ] + */ + + const updatedContents = wrapper.vm.contentBlocksWithContentLists.contents; + + // start at 0 + expect(updatedContents[1].startingIndex).toEqual(0); + // 2nd content list + expect(updatedContents[3].startingIndex).toEqual(1); + // 3rd content list + expect(updatedContents[5].startingIndex).toEqual(3); + }); + + it('should remove single content items', () => { + + const contents = [ + { + type: 'text_block' + }, + { + type: 'content_list', + id: 1, + contents: [ + { + type: 'content_list_item', + value: [ + { + type: 'text_block' + } + ] + }] + }, + { + type: 'text_block' + } + ]; + + const props = { + contentBlock: { + id: 'asbd', + type: 'content', + contents: [] + }, + parent: null + }; + const wrapper = shallowMount(ContentBlock, { + propsData: props, + store, + localVue + }); + + const contents2 = wrapper.vm.removeSingleContentListItem(contents, 1); + + const expectList = [ + { type: 'text_block' }, + { type: 'text_block' }, + { type: 'text_block' } + ]; + // start at 0 + expect(contents2).toEqual(expectList); + }); + + it('should not remove multiple content items', () => { + + const contents = [ + { + type: 'text_block' + }, + { + type: 'content_list', + id: 1, + contents: [ + { + type: 'content_list_item', + value: [ + { + type: 'text_block' + } + ] + }, + { + type: 'content_list_item', + value: [ + { + type: 'text_block' + } + ] + }] + }, + { + type: 'text_block' + } + ]; + + const props = { + contentBlock: { + id: 'asbd', + type: 'content', + contents: [] + }, + parent: null + }; + const wrapper = shallowMount(ContentBlock, { + propsData: props, + store, + localVue + }); + + const contents3 = wrapper.vm.removeSingleContentListItem(contents, 1); + expect(contents3).toEqual(contents); + }); + +}) From 23936ec6ae8b0a8cf4cc015da9a60c2c380709eb Mon Sep 17 00:00:00 2001 From: Ramon Wenger Date: Thu, 12 Sep 2019 09:07:31 +0200 Subject: [PATCH 2/6] Fix bug where surveys don't retain answers without reloading --- client/src/pages/survey.vue | 29 ++++++++++++++++++++++++++++- 1 file changed, 28 insertions(+), 1 deletion(-) diff --git a/client/src/pages/survey.vue b/client/src/pages/survey.vue index d8dd32f6..79f0ff45 100644 --- a/client/src/pages/survey.vue +++ b/client/src/pages/survey.vue @@ -99,7 +99,34 @@ data: JSON.stringify(data) } } - } + }, + refetchQueries: [{ + query: SURVEY_QUERY, + variables: {id: this.id} + }], + // fixme: make the update work instead of refetching + // update: (store, {data: {updateAnswer: {answer}}}) => { + // // try { + // console.log(answer); + // const query = SURVEY_QUERY; + // const variables = {id: this.id}; + // const queryData = store.readQuery({query, variables}); + // console.log('queryData', queryData); + // if (queryData.survey) { + // console.log('answer.data', answer.data); + // queryData.survey.answer = { + // data: { + // ...data, + // __typename: 'AnswerNode' + // } + // }; + // store.writeQuery({query, variables, data: queryData}); + // } + // // } catch (e) { + // // console.error(e); + // // // Query did not exist in the cache, and apollo throws a generic Error. Do nothing + // // } + // } }); }); From 3a19f1a0b5bf1ee593b568a22c5c54b716eb803f Mon Sep 17 00:00:00 2001 From: Christian Cueni Date: Thu, 12 Sep 2019 10:35:49 +0200 Subject: [PATCH 3/6] Remove css numbering, use JS instead --- .../content-blocks/ContentListBlock.vue | 22 +++++++++++++------ 1 file changed, 15 insertions(+), 7 deletions(-) diff --git a/client/src/components/content-blocks/ContentListBlock.vue b/client/src/components/content-blocks/ContentListBlock.vue index bd865cf5..60cd03f9 100644 --- a/client/src/components/content-blocks/ContentListBlock.vue +++ b/client/src/components/content-blocks/ContentListBlock.vue @@ -1,8 +1,11 @@