mirror of
				https://github.com/advplyr/audiobookshelf.git
				synced 2025-10-27 11:18:14 +01:00 
			
		
		
		
	
		
			
				
	
	
		
			85 lines
		
	
	
		
			2.5 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
	
	
			
		
		
	
	
			85 lines
		
	
	
		
			2.5 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
	
	
| import NarratorCard from '@/components/cards/NarratorCard.vue'
 | |
| 
 | |
| describe('<NarratorCard />', () => {
 | |
|   const narrator = {
 | |
|     name: 'John Doe',
 | |
|     numBooks: 5
 | |
|   }
 | |
|   const propsData = {
 | |
|     narrator
 | |
|   }
 | |
|   const mocks = {
 | |
|     $store: {
 | |
|       getters: {
 | |
|         'user/getUserCanUpdate': true,
 | |
|         'user/getSizeMultiplier': 1
 | |
|       },
 | |
|       state: {
 | |
|         libraries: {
 | |
|           currentLibraryId: 'library-123'
 | |
|         }
 | |
|       }
 | |
|     },
 | |
|     $encode: (value) => value
 | |
|   }
 | |
| 
 | |
|   it('renders the component', () => {
 | |
|     let mountOptions = { propsData, mocks }
 | |
|     // see: https://on.cypress.io/mounting-vue
 | |
|     cy.mount(NarratorCard, mountOptions)
 | |
|   })
 | |
| 
 | |
|   it('renders the narrator name correctly', () => {
 | |
|     let mountOptions = { propsData, mocks }
 | |
|     cy.mount(NarratorCard, mountOptions)
 | |
| 
 | |
|     cy.get('&name').should('have.text', 'John Doe')
 | |
|   })
 | |
| 
 | |
|   it('renders the number of books correctly', () => {
 | |
|     let mountOptions = { propsData, mocks }
 | |
|     cy.mount(NarratorCard, mountOptions)
 | |
| 
 | |
|     cy.get('&numBooks').should('have.text', '5 Books')
 | |
|   })
 | |
| 
 | |
|   it('renders 1 book correctly', () => {
 | |
|     let propsData = { narrator: { name: 'John Doe', numBooks: 1 }, width: 200, height: 150 }
 | |
|     let mountOptions = { propsData, mocks }
 | |
|     cy.mount(NarratorCard, mountOptions)
 | |
| 
 | |
|     cy.get('&numBooks').should('have.text', '1 Book')
 | |
|   })
 | |
| 
 | |
|   it('renders the default name and num-books when narrator is not provided', () => {
 | |
|     let propsData = { width: 200, height: 150 }
 | |
|     let mountOptions = { propsData, mocks }
 | |
|     cy.mount(NarratorCard, mountOptions)
 | |
|     cy.get('&name').should('have.text', '')
 | |
|     cy.get('&numBooks').should('have.text', '0 Books')
 | |
|   })
 | |
| 
 | |
|   it('has the correct width and height', () => {
 | |
|     let mountOptions = { propsData, mocks }
 | |
|     cy.mount(NarratorCard, mountOptions)
 | |
|     cy.get('&card').should('have.css', 'width', '150px')
 | |
|     cy.get('&card').should('have.css', 'height', '100px')
 | |
|   })
 | |
| 
 | |
|   it('has the correct width and height when not provided', () => {
 | |
|     let propsData = { narrator }
 | |
|     let mountOptions = { propsData, mocks }
 | |
|     cy.mount(NarratorCard, mountOptions)
 | |
|     cy.get('&card').should('have.css', 'width', '150px')
 | |
|     cy.get('&card').should('have.css', 'height', '100px')
 | |
|   })
 | |
| 
 | |
|   it('has the correct font sizes', () => {
 | |
|     let mountOptions = { propsData, mocks }
 | |
|     cy.mount(NarratorCard, mountOptions)
 | |
|     const defaultFontSize = 16
 | |
|     cy.get('&name').should('have.css', 'font-size', `${0.75 * defaultFontSize}px`)
 | |
|     cy.get('&numBooks').should('have.css', 'font-size', `${0.65 * defaultFontSize}px`)
 | |
|   })
 | |
| })
 |