Mirrors/audiobookshelf
Mirrors/audiobookshelf
1
0
Fork 0
mirror of https://github.com/advplyr/audiobookshelf.git synced 2025-09-10 17:58:02 +02:00
Code Issues Packages Projects Releases Wiki Activity

Added test to validate square/rectangle sub-sorting (ascending)

Browse Source
This commit is contained in:
tagmeh 2025-08-08 01:43:21 -05:00
parent 34c4e7b084
commit 46d56a8f74
1 changed files with 51 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

62
client/cypress/tests/components/covers/SortedCovers.cy.js
View File

@ -3,10 +3,14 @@ import DisplayCover from '@/components/covers/DisplayCover.vue'
describe('SortedCovers.vue', () => {
const mockCovers = [
{ url: 'cover1.jpg', width: 400, height: 400 }, // square
{ url: 'cover2.jpg', width: 300, height: 450 }, // rectangle
{ url: 'cover3.jpg', width: 200, height: 200 }, // square (smaller)
{ url: 'cover4.jpg', width: 350, height: 500 } // rectangle
// 3 rectangles, 4 squares
{ url: 'cover1.jpg', width: 400, height: 400 }, // middle square
{ url: 'cover2.jpg', width: 300, height: 450 }, // smallest rectangle
{ url: 'cover3.jpg', width: 200, height: 200 }, // smallest square
{ url: 'cover4.jpg', width: 350, height: 500 }, // middle rectangle
{ url: 'cover5.jpg', width: 500, height: 500 }, // largest square
{ url: 'cover6.jpg', width: 600, height: 800 }, // largest rectangle
{ url: 'cover7.jpg', width: 450, height: 450 } // middle2 square
]
const stubs = {
@ -23,6 +27,42 @@ describe('SortedCovers.vue', () => {
stubs
}
it('should correctly sort covers by size within their categories', () => {
cy.mount(SortedCovers, mountOptions)
// Check primary section (squares)
cy.get('[cy-id="primaryCoversSectionContainer"] img')
.eq(0) // First section
.should('have.attr', 'src')
.and('include', 'cover3.jpg') // Smallest square first
cy.get('[cy-id="primaryCoversSectionContainer"] img')
.eq(1) // First section
.should('have.attr', 'src')
.and('include', 'cover1.jpg') // Middle square second
cy.get('[cy-id="primaryCoversSectionContainer"] img')
.eq(2) // First section
.should('have.attr', 'src')
.and('include', 'cover7.jpg') // Middle2 square third
cy.get('[cy-id="primaryCoversSectionContainer"] img')
.eq(3) // First section
.should('have.attr', 'src')
.and('include', 'cover5.jpg') // Largest square last
// Check secondary section (rectangles)
cy.get('[cy-id="secondaryCoversSectionContainer"] img')
.eq(0) // Second section
.should('have.attr', 'src')
.and('include', 'cover2.jpg') // Smallest rectangle first
cy.get('[cy-id="secondaryCoversSectionContainer"] img')
.eq(1) // Second section
.should('have.attr', 'src')
.and('include', 'cover4.jpg') // Middle rectangle second
cy.get('[cy-id="secondaryCoversSectionContainer"] img')
.eq(2) // Second section
.should('have.attr', 'src')
.and('include', 'cover6.jpg') // Largest rectangle last
})
it('should render square covers in primary section', () => {
cy.mount(SortedCovers, mountOptions)
@ -30,8 +70,8 @@ describe('SortedCovers.vue', () => {
cy.get('.flex.items-center.flex-wrap.justify-center')
.first()
.within(() => {
// Should find 2 covers
cy.get('.cursor-pointer').should('have.length', 2)
// Should find 3 covers
cy.get('.cursor-pointer').should('have.length', 4)
})
})
@ -42,15 +82,15 @@ describe('SortedCovers.vue', () => {
cy.get('.flex.items-center.flex-wrap.justify-center')
.eq(1)
.within(() => {
// Should find 2 covers
cy.get('.cursor-pointer').should('have.length', 2)
// Should find 3 covers
cy.get('.cursor-pointer').should('have.length', 3)
})
})
it('should show divider when both cover types exist', () => {
cy.mount(SortedCovers, mountOptions)
// Divider should be present
cy.get('.border-b.border-white\\/10').should('exist')
cy.get('&sortedCoversDivider').should('exist')
})
})
@ -71,8 +111,8 @@ describe('SortedCovers.vue', () => {
cy.get('.flex.items-center.flex-wrap.justify-center')
.first()
.within(() => {
// Should find 2 covers
cy.get('.cursor-pointer').should('have.length', 2)
// Should find 3 covers
cy.get('.cursor-pointer').should('have.length', 3)
})
})
})