Specs for the gallery component
This commit is contained in:
parent
ceebf6ac2e
commit
0dd343f2d4
276
test/unit/specs/components/gallery.spec.js
Normal file
276
test/unit/specs/components/gallery.spec.js
Normal file
|
@ -0,0 +1,276 @@
|
|||
import Gallery from 'src/components/gallery/gallery.vue'
|
||||
|
||||
describe.only('Gallery', () => {
|
||||
let local
|
||||
|
||||
it('attachments is falsey', () => {
|
||||
local = { attachments: false }
|
||||
expect(Gallery.computed.rows.call(local)).to.eql([])
|
||||
|
||||
local = { attachments: null }
|
||||
expect(Gallery.computed.rows.call(local)).to.eql([])
|
||||
|
||||
local = { attachments: undefined }
|
||||
expect(Gallery.computed.rows.call(local)).to.eql([])
|
||||
})
|
||||
|
||||
it('no attachments', () => {
|
||||
local = { attachments: [] }
|
||||
expect(Gallery.computed.rows.call(local)).to.eql([])
|
||||
})
|
||||
|
||||
it('one audio attachment', () => {
|
||||
local = {
|
||||
attachments: [
|
||||
{ mimetype: 'audio/mpeg' }
|
||||
]
|
||||
}
|
||||
|
||||
expect(Gallery.computed.rows.call(local)).to.eql([
|
||||
{ audio: true, items: [{ mimetype: 'audio/mpeg' }] }
|
||||
])
|
||||
})
|
||||
|
||||
it('one image attachment', () => {
|
||||
local = {
|
||||
attachments: [
|
||||
{ mimetype: 'image/png' }
|
||||
]
|
||||
}
|
||||
|
||||
expect(Gallery.computed.rows.call(local)).to.eql([
|
||||
{ items: [{ mimetype: 'image/png' }] }
|
||||
])
|
||||
})
|
||||
|
||||
it('one audio attachment and one image attachment', () => {
|
||||
local = {
|
||||
attachments: [
|
||||
{ mimetype: 'audio/mpeg' },
|
||||
{ mimetype: 'image/png' }
|
||||
]
|
||||
}
|
||||
|
||||
expect(Gallery.computed.rows.call(local)).to.eql([
|
||||
{ audio: true, items: [{ mimetype: 'audio/mpeg' }] },
|
||||
{ items: [{ mimetype: 'image/png' }] }
|
||||
])
|
||||
})
|
||||
|
||||
it('has "size" key set to "hide"', () => {
|
||||
let local
|
||||
local = {
|
||||
attachments: [
|
||||
{ mimetype: 'audio/mpeg' }
|
||||
],
|
||||
size: 'hide'
|
||||
}
|
||||
|
||||
expect(Gallery.computed.rows.call(local)).to.eql([
|
||||
{ minimal: true, items: [{ mimetype: 'audio/mpeg' }] }
|
||||
])
|
||||
|
||||
local = {
|
||||
attachments: [
|
||||
{ mimetype: 'image/jpg' },
|
||||
{ mimetype: 'image/png' },
|
||||
{ mimetype: 'image/jpg' },
|
||||
{ mimetype: 'audio/mpeg' },
|
||||
{ mimetype: 'image/png' },
|
||||
{ mimetype: 'audio/mpeg' },
|
||||
{ mimetype: 'image/jpg' },
|
||||
{ mimetype: 'image/png' },
|
||||
{ mimetype: 'image/jpg' }
|
||||
],
|
||||
size: 'hide'
|
||||
}
|
||||
|
||||
// When defining `size: hide`, the `items` aren't
|
||||
// grouped and `audio` isn't set
|
||||
expect(Gallery.computed.rows.call(local)).to.eql([
|
||||
{ minimal: true, items: [{ mimetype: 'image/jpg' }] },
|
||||
{ minimal: true, items: [{ mimetype: 'image/png' }] },
|
||||
{ minimal: true, items: [{ mimetype: 'image/jpg' }] },
|
||||
{ minimal: true, items: [{ mimetype: 'audio/mpeg' }] },
|
||||
{ minimal: true, items: [{ mimetype: 'image/png' }] },
|
||||
{ minimal: true, items: [{ mimetype: 'audio/mpeg' }] },
|
||||
{ minimal: true, items: [{ mimetype: 'image/jpg' }] },
|
||||
{ minimal: true, items: [{ mimetype: 'image/png' }] },
|
||||
{ minimal: true, items: [{ mimetype: 'image/jpg' }] }
|
||||
])
|
||||
})
|
||||
|
||||
// types other than image or audio should be `minimal`
|
||||
it('non-image/audio', () => {
|
||||
let local
|
||||
local = {
|
||||
attachments: [
|
||||
{ mimetype: 'plain/text' }
|
||||
]
|
||||
}
|
||||
expect(Gallery.computed.rows.call(local)).to.eql([
|
||||
{ minimal: true, items: [{ mimetype: 'plain/text' }] }
|
||||
])
|
||||
|
||||
// No grouping of non-image/audio items
|
||||
local = {
|
||||
attachments: [
|
||||
{ mimetype: 'plain/text' },
|
||||
{ mimetype: 'plain/text' },
|
||||
{ mimetype: 'plain/text' }
|
||||
]
|
||||
}
|
||||
expect(Gallery.computed.rows.call(local)).to.eql([
|
||||
{ minimal: true, items: [{ mimetype: 'plain/text' }] },
|
||||
{ minimal: true, items: [{ mimetype: 'plain/text' }] },
|
||||
{ minimal: true, items: [{ mimetype: 'plain/text' }] }
|
||||
])
|
||||
|
||||
local = {
|
||||
attachments: [
|
||||
{ mimetype: 'image/png' },
|
||||
{ mimetype: 'plain/text' },
|
||||
{ mimetype: 'image/jpg' },
|
||||
{ mimetype: 'audio/mpeg' }
|
||||
]
|
||||
}
|
||||
// NOTE / TODO: When defining `size: hide`, the `items` aren't
|
||||
// grouped and `audio` isn't set
|
||||
expect(Gallery.computed.rows.call(local)).to.eql([
|
||||
{ items: [{ mimetype: 'image/png' }] },
|
||||
{ minimal: true, items: [{ mimetype: 'plain/text' }] },
|
||||
{ items: [{ mimetype: 'image/jpg' }] },
|
||||
{ audio: true, items: [{ mimetype: 'audio/mpeg' }] }
|
||||
])
|
||||
})
|
||||
|
||||
it('mixed attachments', () => {
|
||||
local = {
|
||||
attachments: [
|
||||
{ mimetype: 'audio/mpeg' },
|
||||
{ mimetype: 'image/png' },
|
||||
{ mimetype: 'audio/mpeg' },
|
||||
{ mimetype: 'image/jpg' },
|
||||
{ mimetype: 'image/png' },
|
||||
{ mimetype: 'image/jpg' },
|
||||
{ mimetype: 'image/jpg' }
|
||||
]
|
||||
}
|
||||
|
||||
expect(Gallery.computed.rows.call(local)).to.eql([
|
||||
{ audio: true, items: [{ mimetype: 'audio/mpeg' }] },
|
||||
{ items: [{ mimetype: 'image/png' }] },
|
||||
{ audio: true, items: [{ mimetype: 'audio/mpeg' }] },
|
||||
{ items: [{ mimetype: 'image/jpg' }, { mimetype: 'image/png' }, { mimetype: 'image/jpg' }, { mimetype: 'image/jpg' }] }
|
||||
])
|
||||
|
||||
local = {
|
||||
attachments: [
|
||||
{ mimetype: 'image/jpg' },
|
||||
{ mimetype: 'image/png' },
|
||||
{ mimetype: 'image/jpg' },
|
||||
{ mimetype: 'image/jpg' },
|
||||
{ mimetype: 'audio/mpeg' },
|
||||
{ mimetype: 'image/png' },
|
||||
{ mimetype: 'audio/mpeg' }
|
||||
]
|
||||
}
|
||||
|
||||
expect(Gallery.computed.rows.call(local)).to.eql([
|
||||
{ items: [{ mimetype: 'image/jpg' }, { mimetype: 'image/png' }, { mimetype: 'image/jpg' }] },
|
||||
{ items: [{ mimetype: 'image/jpg' }] },
|
||||
{ audio: true, items: [{ mimetype: 'audio/mpeg' }] },
|
||||
{ items: [{ mimetype: 'image/png' }] },
|
||||
{ audio: true, items: [{ mimetype: 'audio/mpeg' }] }
|
||||
])
|
||||
|
||||
local = {
|
||||
attachments: [
|
||||
{ mimetype: 'image/jpg' },
|
||||
{ mimetype: 'image/png' },
|
||||
{ mimetype: 'image/jpg' },
|
||||
{ mimetype: 'image/jpg' },
|
||||
{ mimetype: 'image/png' },
|
||||
{ mimetype: 'image/png' },
|
||||
{ mimetype: 'image/jpg' }
|
||||
]
|
||||
}
|
||||
|
||||
// Group by three-per-row, unless there's one dangling, then stick it on the end of the last row
|
||||
// https://git.pleroma.social/pleroma/pleroma-fe/-/merge_requests/1785#note_98514
|
||||
expect(Gallery.computed.rows.call(local)).to.eql([
|
||||
{ items: [{ mimetype: 'image/jpg' }, { mimetype: 'image/png' }, { mimetype: 'image/jpg' }] },
|
||||
{ items: [{ mimetype: 'image/jpg' }, { mimetype: 'image/png' }, { mimetype: 'image/png' }, { mimetype: 'image/jpg' }] }
|
||||
])
|
||||
|
||||
local = {
|
||||
attachments: [
|
||||
{ mimetype: 'image/jpg' },
|
||||
{ mimetype: 'image/png' },
|
||||
{ mimetype: 'image/jpg' },
|
||||
{ mimetype: 'image/jpg' },
|
||||
{ mimetype: 'image/png' },
|
||||
{ mimetype: 'image/png' },
|
||||
{ mimetype: 'image/jpg' },
|
||||
{ mimetype: 'image/png' }
|
||||
]
|
||||
}
|
||||
|
||||
expect(Gallery.computed.rows.call(local)).to.eql([
|
||||
{ items: [{ mimetype: 'image/jpg' }, { mimetype: 'image/png' }, { mimetype: 'image/jpg' }] },
|
||||
{ items: [{ mimetype: 'image/jpg' }, { mimetype: 'image/png' }, { mimetype: 'image/png' }] },
|
||||
{ items: [{ mimetype: 'image/jpg' }, { mimetype: 'image/png' }] }
|
||||
])
|
||||
})
|
||||
|
||||
it('does not do grouping when grid is set', () => {
|
||||
const attachments = [
|
||||
{ mimetype: 'audio/mpeg' },
|
||||
{ mimetype: 'image/png' },
|
||||
{ mimetype: 'audio/mpeg' },
|
||||
{ mimetype: 'image/jpg' },
|
||||
{ mimetype: 'image/png' },
|
||||
{ mimetype: 'image/jpg' },
|
||||
{ mimetype: 'image/jpg' }
|
||||
]
|
||||
|
||||
local = { grid: true, attachments }
|
||||
|
||||
expect(Gallery.computed.rows.call(local)).to.eql([
|
||||
{ grid: true, items: attachments }
|
||||
])
|
||||
})
|
||||
|
||||
it('limit is set', () => {
|
||||
const attachments = [
|
||||
{ mimetype: 'audio/mpeg' },
|
||||
{ mimetype: 'image/png' },
|
||||
{ mimetype: 'image/jpg' },
|
||||
{ mimetype: 'audio/mpeg' },
|
||||
{ mimetype: 'image/jpg' }
|
||||
]
|
||||
|
||||
let local
|
||||
local = { attachments, limit: 2 }
|
||||
|
||||
expect(Gallery.computed.rows.call(local)).to.eql([
|
||||
{ audio: true, items: [{ mimetype: 'audio/mpeg' }] },
|
||||
{ items: [{ mimetype: 'image/png' }] }
|
||||
])
|
||||
|
||||
local = { attachments, limit: 3 }
|
||||
|
||||
expect(Gallery.computed.rows.call(local)).to.eql([
|
||||
{ audio: true, items: [{ mimetype: 'audio/mpeg' }] },
|
||||
{ items: [{ mimetype: 'image/png' }, { mimetype: 'image/jpg' }] }
|
||||
])
|
||||
|
||||
local = { attachments, limit: 4 }
|
||||
|
||||
expect(Gallery.computed.rows.call(local)).to.eql([
|
||||
{ audio: true, items: [{ mimetype: 'audio/mpeg' }] },
|
||||
{ items: [{ mimetype: 'image/png' }, { mimetype: 'image/jpg' }] },
|
||||
{ audio: true, items: [{ mimetype: 'audio/mpeg' }] }
|
||||
])
|
||||
})
|
||||
})
|
Loading…
Reference in a new issue