Compare commits

..

No commits in common. "e87825f8df3d208d237f15c795b977feec4effa4" and "7f3421f78ac47d2eb5f95f2536c7aec92ecb40a3" have entirely different histories.

11 changed files with 19 additions and 85 deletions

View file

@ -1,48 +0,0 @@
name: Run Component Tests
on:
workflow_dispatch:
inputs:
ref:
description: 'Branch/Tag/SHA to test'
required: true
pull_request:
paths:
- 'client/**'
- '.github/workflows/component-tests.yml'
push:
paths:
- 'client/**'
- '.github/workflows/component-tests.yml'
jobs:
run-component-tests:
name: Run Component Tests
runs-on: ubuntu-latest
steps:
- name: Checkout (push/pull request)
uses: actions/checkout@v4
if: github.event_name != 'workflow_dispatch'
- name: Checkout (workflow_dispatch)
uses: actions/checkout@v4
with:
ref: ${{ inputs.ref }}
if: github.event_name == 'workflow_dispatch'
- name: Set up Node.js
uses: actions/setup-node@v4
with:
node-version: 20
cache: 'npm'
- name: Install dependencies
run: |
cd client
npm ci
- name: Run tests
run: |
cd client
npm test

View file

@ -223,7 +223,8 @@ export default {
return this.mediaMetadata.explicit || false return this.mediaMetadata.explicit || false
}, },
placeholderUrl() { placeholderUrl() {
return this.store.getters['globals/getPlaceholderCoverSrc'] const config = this.$config || this.$nuxt.$config
return `${config.routerBasePath}/book_placeholder.jpg`
}, },
bookCoverSrc() { bookCoverSrc() {
return this.store.getters['globals/getLibraryItemCoverSrc'](this._libraryItem, this.placeholderUrl) return this.store.getters['globals/getLibraryItemCoverSrc'](this._libraryItem, this.placeholderUrl)

View file

@ -96,8 +96,8 @@ export default {
return this.author return this.author
}, },
placeholderUrl() { placeholderUrl() {
const store = this.$store || this.$nuxt.$store const config = this.$config || this.$nuxt.$config
return store.getters['globals/getPlaceholderCoverSrc'] return `${config.routerBasePath}/book_placeholder.jpg`
}, },
fullCoverUrl() { fullCoverUrl() {
if (!this.libraryItem) return null if (!this.libraryItem) return null

View file

@ -18,7 +18,7 @@
</div> </div>
</div> </div>
<p v-if="!imageFailed && showResolution && resolution" class="absolute -bottom-5 left-0 right-0 mx-auto text-xs text-gray-300 text-center">{{ resolution }}</p> <p v-if="!imageFailed && showResolution" class="absolute -bottom-5 left-0 right-0 mx-auto text-xs text-gray-300 text-center">{{ resolution }}</p>
</div> </div>
</template> </template>
@ -65,12 +65,11 @@ export default {
return 0.8 * this.sizeMultiplier return 0.8 * this.sizeMultiplier
}, },
resolution() { resolution() {
if (!this.naturalWidth || !this.naturalHeight) return null
return `${this.naturalWidth}×${this.naturalHeight}px` return `${this.naturalWidth}×${this.naturalHeight}px`
}, },
placeholderUrl() { placeholderUrl() {
const store = this.$store || this.$nuxt.$store const config = this.$config || this.$nuxt.$config
return store.getters['globals/getPlaceholderCoverSrc'] return `${config.routerBasePath}/book_placeholder.jpg`
} }
}, },
methods: { methods: {

View file

@ -2,7 +2,7 @@
<div class="w-full h-full overflow-hidden overflow-y-auto px-2 sm:px-4 py-6 relative"> <div class="w-full h-full overflow-hidden overflow-y-auto px-2 sm:px-4 py-6 relative">
<div class="flex flex-col sm:flex-row mb-4"> <div class="flex flex-col sm:flex-row mb-4">
<div class="relative self-center md:self-start"> <div class="relative self-center md:self-start">
<covers-preview-cover :src="coverUrl" :width="120" :book-cover-aspect-ratio="bookCoverAspectRatio" /> <covers-preview-cover :src="$store.getters['globals/getLibraryItemCoverSrcById'](libraryItemId, libraryItemUpdatedAt, true)" :width="120" :book-cover-aspect-ratio="bookCoverAspectRatio" />
<!-- book cover overlay --> <!-- book cover overlay -->
<div v-if="media.coverPath" class="absolute top-0 left-0 w-full h-full z-10 opacity-0 hover:opacity-100 transition-opacity duration-100"> <div v-if="media.coverPath" class="absolute top-0 left-0 w-full h-full z-10 opacity-0 hover:opacity-100 transition-opacity duration-100">
@ -157,12 +157,6 @@ export default {
coverPath() { coverPath() {
return this.media.coverPath return this.media.coverPath
}, },
coverUrl() {
if (!this.coverPath) {
return this.$store.getters['globals/getPlaceholderCoverSrc']
}
return this.$store.getters['globals/getLibraryItemCoverSrcById'](this.libraryItemId, this.libraryItemUpdatedAt, true)
},
mediaMetadata() { mediaMetadata() {
return this.media.metadata || {} return this.media.metadata || {}
}, },

View file

@ -55,7 +55,7 @@ export default {
return this.item.coverPath return this.item.coverPath
}, },
coverUrl() { coverUrl() {
if (!this.coverPath) return this.$store.getters['globals/getPlaceholderCoverSrc'] if (!this.coverPath) return `${this.$config.routerBasePath}/book_placeholder.jpg`
return this.$store.getters['globals/getLibraryItemCoverSrcById'](this.libraryItemId) return this.$store.getters['globals/getLibraryItemCoverSrcById'](this.libraryItemId)
}, },
bookCoverAspectRatio() { bookCoverAspectRatio() {

View file

@ -19,9 +19,7 @@ describe('AuthorCard', () => {
const mocks = { const mocks = {
$strings: { $strings: {
LabelBooks: 'Books', LabelBooks: 'Books',
ButtonQuickMatch: 'Quick Match', ButtonQuickMatch: 'Quick Match'
ToastAuthorUpdateSuccess: 'Author updated',
ToastAuthorUpdateSuccessNoImageFound: 'Author updated (no image found)'
}, },
$store: { $store: {
getters: { getters: {
@ -169,7 +167,7 @@ describe('AuthorCard', () => {
cy.get('&match').click() cy.get('&match').click()
cy.get('&spinner').should('be.hidden') cy.get('&spinner').should('be.hidden')
cy.get('@success').should('have.been.calledOnceWithExactly', 'Author updated (no image found)') cy.get('@success').should('have.been.calledOnceWithExactly', 'Author John Doe was updated (no image found)')
cy.get('@error').should('not.have.been.called') cy.get('@error').should('not.have.been.called')
cy.get('@info').should('not.have.been.called') cy.get('@info').should('not.have.been.called')
}) })
@ -191,7 +189,7 @@ describe('AuthorCard', () => {
cy.get('&match').click() cy.get('&match').click()
cy.get('&spinner').should('be.hidden') cy.get('&spinner').should('be.hidden')
cy.get('@success').should('have.been.calledOnceWithExactly', 'Author updated') cy.get('@success').should('have.been.calledOnceWithExactly', 'Author John Doe was updated')
cy.get('@error').should('not.have.been.called') cy.get('@error').should('not.have.been.called')
cy.get('@info').should('not.have.been.called') cy.get('@info').should('not.have.been.called')
}) })

View file

@ -172,7 +172,6 @@ describe('LazyBookCard', () => {
}) })
it('shows titleImageNotReady and sets opacity 0 on coverImage when image not ready', () => { it('shows titleImageNotReady and sets opacity 0 on coverImage when image not ready', () => {
mountOptions.mocks.$store.getters['globals/getLibraryItemCoverSrc'] = () => 'https://my.server.com/notfound.jpg'
cy.mount(LazyBookCard, mountOptions) cy.mount(LazyBookCard, mountOptions)
cy.get('&titleImageNotReady').should('be.visible') cy.get('&titleImageNotReady').should('be.visible')
@ -258,7 +257,7 @@ describe('LazyBookCard', () => {
cy.get('#book-card-0').trigger('mouseover') cy.get('#book-card-0').trigger('mouseover')
cy.get('&titleImageNotReady').should('be.hidden') cy.get('&titleImageNotReady').should('be.hidden')
cy.get('&seriesNameOverlay').should('be.visible').and('have.text', 'The Lord of the Rings') cy.get('&seriesNameOverlay').should('be.visible').and('have.text', 'Middle Earth Chronicles')
}) })
it('shows the seriesSequenceList when collapsed series has a sequence list', () => { it('shows the seriesSequenceList when collapsed series has a sequence list', () => {

View file

@ -30,14 +30,6 @@ describe('LazySeriesCard', () => {
} }
const mocks = { const mocks = {
$getString: (id, args) => {
switch (id) {
case 'LabelAddedDate':
return `Added ${args[0]}`
default:
return null
}
},
$store: { $store: {
getters: { getters: {
'user/getUserCanUpdate': true, 'user/getUserCanUpdate': true,

View file

@ -64,7 +64,7 @@ export default {
return this.mediaItemShare.playbackSession return this.mediaItemShare.playbackSession
}, },
coverUrl() { coverUrl() {
if (!this.playbackSession.coverPath) return this.$store.getters['globals/getPlaceholderCoverSrc'] if (!this.playbackSession.coverPath) return `${this.$config.routerBasePath}/book_placeholder.jpg`
return `${this.$config.routerBasePath}/public/share/${this.mediaItemShare.slug}/cover` return `${this.$config.routerBasePath}/public/share/${this.mediaItemShare.slug}/cover`
}, },
downloadUrl() { downloadUrl() {

View file

@ -87,7 +87,7 @@ export const getters = {
getLibraryItemCoverSrc: getLibraryItemCoverSrc:
(state, getters, rootState, rootGetters) => (state, getters, rootState, rootGetters) =>
(libraryItem, placeholder = null, raw = false) => { (libraryItem, placeholder = null, raw = false) => {
if (!placeholder) placeholder = getters.getPlaceholderCoverSrc if (!placeholder) placeholder = `${rootState.routerBasePath}/book_placeholder.jpg`
if (!libraryItem) return placeholder if (!libraryItem) return placeholder
const media = libraryItem.media const media = libraryItem.media
if (!media?.coverPath || media.coverPath === placeholder) return placeholder if (!media?.coverPath || media.coverPath === placeholder) return placeholder
@ -95,6 +95,7 @@ export const getters = {
// Absolute URL covers (should no longer be used) // Absolute URL covers (should no longer be used)
if (media.coverPath.startsWith('http:') || media.coverPath.startsWith('https:')) return media.coverPath if (media.coverPath.startsWith('http:') || media.coverPath.startsWith('https:')) return media.coverPath
const userToken = rootGetters['user/getToken']
const lastUpdate = libraryItem.updatedAt || Date.now() const lastUpdate = libraryItem.updatedAt || Date.now()
const libraryItemId = libraryItem.libraryItemId || libraryItem.id // Workaround for /users/:id page showing media progress covers const libraryItemId = libraryItem.libraryItemId || libraryItem.id // Workaround for /users/:id page showing media progress covers
return `${rootState.routerBasePath}/api/items/${libraryItemId}/cover?ts=${lastUpdate}${raw ? '&raw=1' : ''}` return `${rootState.routerBasePath}/api/items/${libraryItemId}/cover?ts=${lastUpdate}${raw ? '&raw=1' : ''}`
@ -102,13 +103,11 @@ export const getters = {
getLibraryItemCoverSrcById: getLibraryItemCoverSrcById:
(state, getters, rootState, rootGetters) => (state, getters, rootState, rootGetters) =>
(libraryItemId, timestamp = null, raw = false) => { (libraryItemId, timestamp = null, raw = false) => {
if (!libraryItemId) return getters.getPlaceholderCoverSrc const placeholder = `${rootState.routerBasePath}/book_placeholder.jpg`
if (!libraryItemId) return placeholder
const userToken = rootGetters['user/getToken']
return `${rootState.routerBasePath}/api/items/${libraryItemId}/cover?${raw ? '&raw=1' : ''}${timestamp ? `&ts=${timestamp}` : ''}` return `${rootState.routerBasePath}/api/items/${libraryItemId}/cover?${raw ? '&raw=1' : ''}${timestamp ? `&ts=${timestamp}` : ''}`
}, },
getPlaceholderCoverSrc: (state, getters, rootState, rootGetters) => {
return `${rootState.routerBasePath}/book_placeholder.jpg`
},
getIsBatchSelectingMediaItems: (state) => { getIsBatchSelectingMediaItems: (state) => {
return state.selectedMediaItems.length return state.selectedMediaItems.length
} }