From 6ce797e8efaab88bccb79d762e4fb801de7061b1 Mon Sep 17 00:00:00 2001 From: ogerly Date: Wed, 4 Dec 2019 11:20:27 +0100 Subject: [PATCH] test review --- backend/src/models/Post.js | 2 +- backend/src/schema/resolvers/posts.js | 2 +- backend/src/schema/types/type/Post.gql | 10 +++--- backend/src/seed/seed-db.js | 36 +++++++++---------- .../ContributionForm/ContributionForm.spec.js | 4 ++- .../ContributionForm/ContributionForm.vue | 28 +++++++++++---- webapp/components/PostCard/PostCard.vue | 2 +- webapp/graphql/Fragments.js | 2 +- webapp/graphql/PostMutations.js | 12 +++---- webapp/pages/post/_id/_slug/index.vue | 14 ++++---- 10 files changed, 65 insertions(+), 47 deletions(-) diff --git a/backend/src/models/Post.js b/backend/src/models/Post.js index 2d2a164db..af2baf604 100644 --- a/backend/src/models/Post.js +++ b/backend/src/models/Post.js @@ -45,5 +45,5 @@ module.exports = { default: () => new Date().toISOString(), }, language: { type: 'string', allow: [null] }, - checkedBlur: { type: 'boolean', default: false }, + blurImage: { type: 'boolean', default: false }, } diff --git a/backend/src/schema/resolvers/posts.js b/backend/src/schema/resolvers/posts.js index 44558be4d..e805a6a91 100644 --- a/backend/src/schema/resolvers/posts.js +++ b/backend/src/schema/resolvers/posts.js @@ -304,7 +304,7 @@ export default { 'language', 'pinnedAt', 'pinned', - 'checkedBlur', + 'blurImage', ], hasMany: { tags: '-[:TAGGED]->(related:Tag)', diff --git a/backend/src/schema/types/type/Post.gql b/backend/src/schema/types/type/Post.gql index f24018567..0cb479d96 100644 --- a/backend/src/schema/types/type/Post.gql +++ b/backend/src/schema/types/type/Post.gql @@ -82,7 +82,7 @@ input _PostFilter { emotions_none: _PostEMOTEDFilter emotions_single: _PostEMOTEDFilter emotions_every: _PostEMOTEDFilter - checkedBlur: Boolean + blurImage: Boolean } enum _PostOrdering { @@ -128,7 +128,7 @@ type Post { createdAt: String updatedAt: String language: String - checkedBlur: Boolean + blurImage: Boolean pinnedAt: String @cypher( statement: "MATCH (this)<-[pinned:PINNED]-(:User) WHERE NOT this.deleted = true AND NOT this.disabled = true RETURN pinned.createdAt" ) @@ -184,7 +184,7 @@ type Mutation { language: String categoryIds: [ID] contentExcerpt: String - checkedBlur: Boolean + blurImage: Boolean ): Post UpdatePost( id: ID! @@ -197,7 +197,7 @@ type Mutation { visibility: Visibility language: String categoryIds: [ID] - checkedBlur: Boolean + blurImage: Boolean ): Post DeletePost(id: ID!): Post AddPostEmotions(to: _PostInput!, data: _EMOTEDInput!): EMOTED @@ -218,7 +218,7 @@ type Query { createdAt: String updatedAt: String language: String - checkedBlur: Boolean + blurImage: Boolean first: Int offset: Int orderBy: [_PostOrdering] diff --git a/backend/src/seed/seed-db.js b/backend/src/seed/seed-db.js index 1fd819a87..d93c9c1a6 100644 --- a/backend/src/seed/seed-db.js +++ b/backend/src/seed/seed-db.js @@ -352,7 +352,7 @@ const languages = ['de', 'en', 'es', 'fr', 'it', 'pt', 'pl'] language: sample(languages), image: faker.image.unsplash.food(), categoryIds: ['cat16'], - checkedBlur: true, + blurImage: true, }), factory.create('Post', { author: bobDerBaumeister, @@ -360,28 +360,28 @@ const languages = ['de', 'en', 'es', 'fr', 'it', 'pt', 'pl'] language: sample(languages), image: faker.image.unsplash.technology(), categoryIds: ['cat1'], - checkedBlur: false, + blurImage: false, }), factory.create('Post', { author: huey, id: 'p3', language: sample(languages), categoryIds: ['cat3'], - checkedBlur: false, + blurImage: false, }), factory.create('Post', { author: dewey, id: 'p4', language: sample(languages), categoryIds: ['cat4'], - checkedBlur: false, + blurImage: false, }), factory.create('Post', { author: louie, id: 'p5', language: sample(languages), categoryIds: ['cat5'], - checkedBlur: false, + blurImage: false, }), factory.create('Post', { authorId: 'u1', @@ -389,20 +389,20 @@ const languages = ['de', 'en', 'es', 'fr', 'it', 'pt', 'pl'] language: sample(languages), image: faker.image.unsplash.buildings(), categoryIds: ['cat6'], - checkedBlur: false, + blurImage: false, }), factory.create('Post', { author: huey, id: 'p9', language: sample(languages), categoryIds: ['cat9'], - checkedBlur: false, + blurImage: false, }), factory.create('Post', { author: dewey, id: 'p10', categoryIds: ['cat10'], - checkedBlur: true, + blurImage: true, }), factory.create('Post', { author: louie, @@ -410,14 +410,14 @@ const languages = ['de', 'en', 'es', 'fr', 'it', 'pt', 'pl'] language: sample(languages), image: faker.image.unsplash.people(), categoryIds: ['cat11'], - checkedBlur: false, + blurImage: false, }), factory.create('Post', { author: bobDerBaumeister, id: 'p13', language: sample(languages), categoryIds: ['cat13'], - checkedBlur: false, + blurImage: false, }), factory.create('Post', { author: jennyRostock, @@ -425,14 +425,14 @@ const languages = ['de', 'en', 'es', 'fr', 'it', 'pt', 'pl'] language: sample(languages), image: faker.image.unsplash.objects(), categoryIds: ['cat14'], - checkedBlur: false, + blurImage: false, }), factory.create('Post', { author: huey, id: 'p15', language: sample(languages), categoryIds: ['cat15'], - checkedBlur: false, + blurImage: false, }), ]) @@ -451,14 +451,14 @@ const languages = ['de', 'en', 'es', 'fr', 'it', 'pt', 'pl'] $title: String! $content: String! $categoryIds: [ID] - $checkedBlur: Boolean + $blurImage: Boolean ) { CreatePost( id: $id title: $title content: $content categoryIds: $categoryIds - checkedBlur: $checkedBlur + blurImage: $blurImage ) { id } @@ -473,7 +473,7 @@ const languages = ['de', 'en', 'es', 'fr', 'it', 'pt', 'pl'] title: `Nature Philosophy Yoga`, content: hashtag1, categoryIds: ['cat2'], - checkedBlur: false, + blurImage: false, }, }), mutate({ @@ -483,7 +483,7 @@ const languages = ['de', 'en', 'es', 'fr', 'it', 'pt', 'pl'] title: 'This is post #7', content: `${mention1} ${faker.lorem.paragraph()}`, categoryIds: ['cat7'], - checkedBlur: false, + blurImage: false, }, }), mutate({ @@ -494,7 +494,7 @@ const languages = ['de', 'en', 'es', 'fr', 'it', 'pt', 'pl'] title: `Quantum Flow Theory explains Quantum Gravity`, content: hashtagAndMention1, categoryIds: ['cat8'], - checkedBlur: false, + blurImage: false, }, }), mutate({ @@ -504,7 +504,7 @@ const languages = ['de', 'en', 'es', 'fr', 'it', 'pt', 'pl'] title: 'This is post #12', content: `${mention2} ${faker.lorem.paragraph()}`, categoryIds: ['cat12'], - checkedBlur: false, + blurImage: false, }, }), ]) diff --git a/webapp/components/ContributionForm/ContributionForm.spec.js b/webapp/components/ContributionForm/ContributionForm.spec.js index adb3a2dca..e8f5eef9a 100644 --- a/webapp/components/ContributionForm/ContributionForm.spec.js +++ b/webapp/components/ContributionForm/ContributionForm.spec.js @@ -199,7 +199,7 @@ describe('ContributionForm.vue', () => { categoryIds: ['cat12'], imageUpload: null, image: null, - checkedBlur: false, + blurImage: false, }, } postTitleInput = wrapper.find('.ds-input') @@ -244,8 +244,10 @@ describe('ContributionForm.vue', () => { describe('questionable images should be blurred', () => { it('questionable images unset be blurred', async () => { + await wrapper.find('input[type="checkbox"]').trigger('click') expect(wrapper.find('input[type="checkbox"]').exists()).toBe(true) + expect(wrapper.find('img.img-blur-in').exists()).toBe(true) }) }) diff --git a/webapp/components/ContributionForm/ContributionForm.vue b/webapp/components/ContributionForm/ContributionForm.vue index 1d91b9359..25be9d753 100644 --- a/webapp/components/ContributionForm/ContributionForm.vue +++ b/webapp/components/ContributionForm/ContributionForm.vue @@ -40,11 +40,12 @@ @@ -190,7 +191,7 @@ export default { ? languageOptions.find(o => this.contribution.language === o.value) : null form.categoryIds = this.categoryIds(this.contribution.categories) - form.checkbox = this.contribution.checkedBlur + form.checkbox = this.contribution.blurImage } return { @@ -225,7 +226,7 @@ export default { }, created() {}, mounted() { - if (this.contribution && this.contribution.checkedBlur === true) { + if (this.contribution && this.contribution.blurImage === true) { this.checkedChange() this.$el.querySelector('.hc-attachments-upload-area-post img').classList.add('img-blur-in') } @@ -246,15 +247,19 @@ export default { }, checkedChange() { if (this.$el) { + console.log(this.$el.querySelector('.crop-overlay')) + console.log(document.querySelector('.crop-overlay')) this.elem = this.$el.querySelector('img') } else { } if (this.checkedBlur) { this.elem.classList.remove('img-blur-in') + document.querySelector('.crop-overlay').classList.remove('images-set-blur') this.checkedBlur = false this.form.checkbox = false } else { if (this.elem != null) { + this.elem.classList.add('img-blur-in') } this.checkedBlur = true @@ -282,7 +287,7 @@ export default { language, image, imageUpload: teaserImage, - checkedBlur: this.form.checkbox, + blurImage: this.form.checkbox, }, }) .then(({ data }) => { @@ -357,7 +362,18 @@ export default { -o-transition: all ease 0.2s; transition: all ease 0.2s; } - +.images-set-blur img{ + -webkit-filter: blur(32px); + -moz-filter: blur(32px); + -ms-filter: blur(32px); + -o-filter: blur(32px); + filter: blur(32px); + -webkit-transition: all ease 0.2s; + -moz-transition: all ease 0.2s; + -ms-transition: all ease 0.2s; + -o-transition: all ease 0.2s; + transition: all ease 0.2s; +} .blurBox { text-align: right; position: relative; diff --git a/webapp/components/PostCard/PostCard.vue b/webapp/components/PostCard/PostCard.vue index bca832682..ca2999db0 100644 --- a/webapp/components/PostCard/PostCard.vue +++ b/webapp/components/PostCard/PostCard.vue @@ -6,7 +6,7 @@ 'post-card': true, 'disabled-content': post.disabled, 'post--pinned': isPinned, - 'images-set-blur': post.checkedBlur, + 'images-set-blur': post.blurImage, }" > diff --git a/webapp/graphql/Fragments.js b/webapp/graphql/Fragments.js index 855ae1533..b4935bb36 100644 --- a/webapp/graphql/Fragments.js +++ b/webapp/graphql/Fragments.js @@ -46,7 +46,7 @@ export const postFragment = lang => gql` slug image language - checkedBlur + blurImage author { ...user } diff --git a/webapp/graphql/PostMutations.js b/webapp/graphql/PostMutations.js index 9d0aea710..8ea94a5de 100644 --- a/webapp/graphql/PostMutations.js +++ b/webapp/graphql/PostMutations.js @@ -9,7 +9,7 @@ export default () => { $language: String $categoryIds: [ID] $imageUpload: Upload - $checkedBlur: Boolean + $blurImage: Boolean ) { CreatePost( title: $title @@ -17,14 +17,14 @@ export default () => { language: $language categoryIds: $categoryIds imageUpload: $imageUpload - checkedBlur: $checkedBlur + blurImage: $blurImage ) { title slug content contentExcerpt language - checkedBlur + blurImage } } `, @@ -37,7 +37,7 @@ export default () => { $imageUpload: Upload $categoryIds: [ID] $image: String - $checkedBlur: Boolean + $blurImage: Boolean ) { UpdatePost( id: $id @@ -47,7 +47,7 @@ export default () => { imageUpload: $imageUpload categoryIds: $categoryIds image: $image - checkedBlur: $checkedBlur + blurImage: $blurImage ) { id title @@ -55,7 +55,7 @@ export default () => { content contentExcerpt language - checkedBlur + blurImage pinnedBy { id name diff --git a/webapp/pages/post/_id/_slug/index.vue b/webapp/pages/post/_id/_slug/index.vue index 32e76c067..769b978b8 100644 --- a/webapp/pages/post/_id/_slug/index.vue +++ b/webapp/pages/post/_id/_slug/index.vue @@ -7,12 +7,12 @@ :class="{ 'post-card': true, 'disabled-content': post.disabled, - 'images-set-blur': post.checkedBlur, + 'images-set-blur': post.blurImage, }" >