Skip to content

Commit

Permalink
fix: Test ConflictPicker.vue in component tests
Browse files Browse the repository at this point in the history 
Signed-off-by: Ferdinand Thiessen <opensource@fthiessen.de>
  • Loading branch information
@susnux
susnux committed Dec 15, 2023
1 parent 90ad38d commit a84e423
Showing 1 changed file with 93 additions and 30 deletions.
123 changes: 93 additions & 30 deletions cypress/components/ConflictPicker.cy.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
import type { ConflictResolutionResult } from '../../lib'

import { File as NcFile } from '@nextcloud/files'
import { openConflictPicker } from '../../lib/index.ts'
import ConflictPicker from '../../lib/components/ConflictPicker.vue'

describe('ConflictPicker rendering', { testIsolation: true }, () => {
let image: File
Expand All @@ -13,6 +13,7 @@ describe('ConflictPicker rendering', { testIsolation: true }, () => {
cy.fixture('image.jpg', null).then((content: Buffer) => {
image = new File([content], 'image.jpg', { type: 'image/jpeg' })
})
cy.wait(5000)
})

it('Renders default ConflictPicker', () => {
Expand All @@ -25,9 +26,15 @@ describe('ConflictPicker rendering', { testIsolation: true }, () => {
mtime: new Date('2021-01-01T00:00:00.000Z'),
})

openConflictPicker('Pictures', [image], [oldImage]).catch(() => {})
cy.mount(ConflictPicker, {
propsData: {
dirname: 'Pictures',
content: [oldImage],
conflicts: [image],
},
})

cy.get('[data-cy-conflict-picker]', { timeout: 10000 }).should('exist')
cy.get('[data-cy-conflict-picker]').should('exist')
cy.get('[data-cy-conflict-picker] h2').should('have.text', '1 file conflict in Pictures')
cy.get('[data-cy-conflict-picker-form]').should('be.visible')

Expand Down Expand Up @@ -72,19 +79,30 @@ describe('ConflictPicker resolving', () => {
mtime: new Date('2021-01-01T00:00:00.000Z'),
})

const promise = openConflictPicker('Pictures', images, [old1, old2])
const onSubmit = cy.spy().as('onSubmitSpy')
const onCancel = cy.spy().as('onCancelSpy')
cy.mount(ConflictPicker, {
propsData: {
dirname: 'Pictures',
content: [old1, old2],
conflicts: images,
},
listeners: {
submit: onSubmit,
cancel: onCancel,
}
})

cy.get('[data-cy-conflict-picker-form]').should('be.visible')
cy.get('[data-cy-conflict-picker-fieldset]').should('have.length', 3)
cy.get('[data-cy-conflict-picker-input-incoming="all"] input').check({ force: true })
cy.get('[data-cy-conflict-picker-submit]').click()

promise.then((results: ConflictResolutionResult) => {
expect(results.selected).to.deep.equal(images)
expect(results.renamed).to.have.length(0)

cy.get('[data-cy-conflict-picker]').should('not.exist')
cy.get('@onSubmitSpy').should('have.been.calledOnce').then((onSubmit) => {
expect(onSubmit.firstCall.args[0].selected).to.deep.equal(images)
expect(onSubmit.firstCall.args[0].renamed).to.have.length(0)
})
cy.get('@onCancelSpy').should('not.have.been.called')
})

it('Pick all existing files', () => {
Expand All @@ -105,19 +123,30 @@ describe('ConflictPicker resolving', () => {
mtime: new Date('2021-01-01T00:00:00.000Z'),
})

const promise = openConflictPicker('Pictures', images, [old1, old2])
const onSubmit = cy.spy().as('onSubmitSpy')
const onCancel = cy.spy().as('onCancelSpy')
cy.mount(ConflictPicker, {
propsData: {
dirname: 'Pictures',
content: [old1, old2],
conflicts: images,
},
listeners: {
submit: onSubmit,
cancel: onCancel,
}
})

cy.get('[data-cy-conflict-picker-form]').should('be.visible')
cy.get('[data-cy-conflict-picker-fieldset]').should('have.length', 3)
cy.get('[data-cy-conflict-picker-input-existing="all"] input').check({ force: true })
cy.get('[data-cy-conflict-picker-submit]').click()

promise.then((results: ConflictResolutionResult) => {
expect(results.selected).to.have.length(0)
expect(results.renamed).to.have.length(0)

cy.get('[data-cy-conflict-picker]').should('not.exist')
cy.get('@onSubmitSpy').should('have.been.calledOnce').then((onSubmit) => {
expect(onSubmit.firstCall.args[0].selected).to.have.length(0)
expect(onSubmit.firstCall.args[0].renamed).to.have.length(0)
})
cy.get('@onCancelSpy').should('not.have.been.called')
})

it('Pick all existing files', () => {
Expand All @@ -138,7 +167,19 @@ describe('ConflictPicker resolving', () => {
mtime: new Date('2021-01-01T00:00:00.000Z'),
})

const promise = openConflictPicker('Pictures', images, [old1, old2])
const onSubmit = cy.spy().as('onSubmitSpy')
const onCancel = cy.spy().as('onCancelSpy')
cy.mount(ConflictPicker, {
propsData: {
dirname: 'Pictures',
content: [old1, old2],
conflicts: images,
},
listeners: {
submit: onSubmit,
cancel: onCancel,
}
})

cy.get('[data-cy-conflict-picker-form]').should('be.visible')
cy.get('[data-cy-conflict-picker-fieldset]').should('have.length', 3)
Expand All @@ -147,13 +188,11 @@ describe('ConflictPicker resolving', () => {
cy.get('[data-cy-conflict-picker-submit]').click()

// We only return the files to handle
cy.wrap(promise).then((results) => {
const result = results as ConflictResolutionResult
expect(result.selected).to.deep.equal([images[0]])
expect(result.renamed).to.have.length(0)

cy.get('[data-cy-conflict-picker]').should('not.exist')
cy.get('@onSubmitSpy').should('have.been.calledOnce').then((onSubmit) => {
expect(onSubmit.firstCall.args[0].selected).to.deep.equal([images[0]])
expect(onSubmit.firstCall.args[0].renamed).to.have.length(0)
})
cy.get('@onCancelSpy').should('not.have.been.called')
})

it('Pick both versions files', () => {
Expand All @@ -174,22 +213,34 @@ describe('ConflictPicker resolving', () => {
mtime: new Date('2021-01-01T00:00:00.000Z'),
})

const promise = openConflictPicker('Pictures', images, [old1, old2])
const onSubmit = cy.spy().as('onSubmitSpy')
const onCancel = cy.spy().as('onCancelSpy')
cy.mount(ConflictPicker, {
propsData: {
dirname: 'Pictures',
content: [old1, old2],
conflicts: images,
},
listeners: {
submit: onSubmit,
cancel: onCancel,
}
})

cy.get('[data-cy-conflict-picker-form]').should('be.visible')
cy.get('[data-cy-conflict-picker-fieldset]').should('have.length', 3)
cy.get('[data-cy-conflict-picker-input-incoming="all"] input').check({ force: true })
cy.get('[data-cy-conflict-picker-input-existing="all"] input').check({ force: true })
cy.get('[data-cy-conflict-picker-submit]').click()

promise.then((results: ConflictResolutionResult) => {
cy.get('@onSubmitSpy').should('have.been.calledOnce').then((onSubmit) => {
const results = (onSubmit as unknown as sinon.SinonSpy).firstCall.args[0]
expect(results.selected).to.have.length(0)
expect(results.renamed).to.have.length(2)
expect((results.renamed[0] as File).name).to.equal('image1 (1).jpg')
expect((results.renamed[1] as File).name).to.equal('image2 (1).jpg')

cy.get('[data-cy-conflict-picker]').should('not.exist')
})
cy.get('@onCancelSpy').should('not.have.been.called')
})

it('Skip all conflicts', () => {
Expand All @@ -210,17 +261,29 @@ describe('ConflictPicker resolving', () => {
mtime: new Date('2021-01-01T00:00:00.000Z'),
})

const promise = openConflictPicker('Pictures', images, [old1, old2])
const onSubmit = cy.spy().as('onSubmitSpy')
const onCancel = cy.spy().as('onCancelSpy')
cy.mount(ConflictPicker, {
propsData: {
dirname: 'Pictures',
content: [old1, old2],
conflicts: images,
},
listeners: {
submit: onSubmit,
cancel: onCancel,
}
})

cy.get('[data-cy-conflict-picker-form]').should('be.visible')
cy.get('[data-cy-conflict-picker-fieldset]').should('have.length', 3)
cy.get('[data-cy-conflict-picker-skip]').click()

promise.then((results: ConflictResolutionResult) => {
cy.get('@onSubmitSpy').should('have.been.calledOnce').then((onSubmit) => {
const results = (onSubmit as unknown as sinon.SinonSpy).firstCall.args[0]
expect(results.selected).to.have.length(0)
expect(results.renamed).to.have.length(0)

cy.get('[data-cy-conflict-picker]').should('not.exist')
})
cy.get('@onCancelSpy').should('not.have.been.called')
})
})

0 comments on commit a84e423

Please sign in to comment.