diff --git a/src/utils/getAvatarUrl.ts b/src/utils/getAvatarUrl.ts index fff72fc264..83ee8ee865 100644 --- a/src/utils/getAvatarUrl.ts +++ b/src/utils/getAvatarUrl.ts @@ -33,7 +33,7 @@ interface AvatarUrlOptions { */ export function getAvatarUrl(user: string, options?: AvatarUrlOptions): string { // backend only supports 64 and 512px - // so we only requrest the needed size for better caching of the request. + // so we only request the needed size for better caching of the request. const size = (options?.size || 64) <= 64 ? 64 : 512 @@ -45,7 +45,7 @@ export function getAvatarUrl(user: string, options?: AvatarUrlOptions): string { ? '/dark' : '' - return generateUrl(`/avatar${guestUrl}/{user}/{size}${themeUrl}`, { + return generateUrl(`/avatar${guestUrl}/{user}/{size}${themeUrl}?guestFallback=true`, { user, size, }) diff --git a/tests/unit/components/NcAvatar/NcAvatar.spec.ts b/tests/unit/components/NcAvatar/NcAvatar.spec.ts index 32fa4067c7..9f9db63627 100644 --- a/tests/unit/components/NcAvatar/NcAvatar.spec.ts +++ b/tests/unit/components/NcAvatar/NcAvatar.spec.ts @@ -153,7 +153,7 @@ describe('NcAvatar.vue', () => { await nextTick() expect(wrapper.find('img').exists()).toBeTruthy() - expect(wrapper.find('img').attributes('src')).toMatch(/avatar\/user1\/64$/) + expect(wrapper.find('img').attributes('src')).toMatch(/avatar\/user1\/64\?guestFallback=true$/) }) it('should render image with avatar url pointing to a user', async () => { diff --git a/tests/unit/utils/getAvatarUrl.spec.ts b/tests/unit/utils/getAvatarUrl.spec.ts index 20e56fe6a0..028492225c 100644 --- a/tests/unit/utils/getAvatarUrl.spec.ts +++ b/tests/unit/utils/getAvatarUrl.spec.ts @@ -12,56 +12,56 @@ describe('getAvatarUrl', () => { }) it('should return correct relative URL for user avatar', () => { - expect(getAvatarUrl('alice')).toBe('//index.php/avatar/alice/64') - expect(getAvatarUrl('john', { size: 64 })).toBe('//index.php/avatar/john/64') + expect(getAvatarUrl('alice')).toBe('//index.php/avatar/alice/64?guestFallback=true') + expect(getAvatarUrl('john', { size: 64 })).toBe('//index.php/avatar/john/64?guestFallback=true') }) it('should return correct relative URL with fixed sizes', () => { /// @ts-expect-error testing invalid value - expect(getAvatarUrl('alice', { size: 0 })).toBe('//index.php/avatar/alice/64') + expect(getAvatarUrl('alice', { size: 0 })).toBe('//index.php/avatar/alice/64?guestFallback=true') /// @ts-expect-error testing invalid value - expect(getAvatarUrl('alice', { size: -1 })).toBe('//index.php/avatar/alice/64') - expect(getAvatarUrl('john', { size: 64 })).toBe('//index.php/avatar/john/64') + expect(getAvatarUrl('alice', { size: -1 })).toBe('//index.php/avatar/alice/64?guestFallback=true') + expect(getAvatarUrl('john', { size: 64 })).toBe('//index.php/avatar/john/64?guestFallback=true') /// @ts-expect-error testing invalid value - expect(getAvatarUrl('john', { size: 65 })).toBe('//index.php/avatar/john/512') - expect(getAvatarUrl('john', { size: 512 })).toBe('//index.php/avatar/john/512') + expect(getAvatarUrl('john', { size: 65 })).toBe('//index.php/avatar/john/512?guestFallback=true') + expect(getAvatarUrl('john', { size: 512 })).toBe('//index.php/avatar/john/512?guestFallback=true') }) it('should return correct relative URL for user avatar in dark mode', () => { document.body.style.setProperty('--background-invert-if-dark', 'invert(100%)') - expect(getAvatarUrl('alice')).toBe('//index.php/avatar/alice/64/dark') - expect(getAvatarUrl('john', { size: 512 })).toBe('//index.php/avatar/john/512/dark') + expect(getAvatarUrl('alice')).toBe('//index.php/avatar/alice/64/dark?guestFallback=true') + expect(getAvatarUrl('john', { size: 512 })).toBe('//index.php/avatar/john/512/dark?guestFallback=true') }) it('should return correct relative URL for user avatar in dark mode if enforced', () => { - expect(getAvatarUrl('alice', { isDarkTheme: true })).toBe('//index.php/avatar/alice/64/dark') - expect(getAvatarUrl('john', { isDarkTheme: true, size: 512 })).toBe('//index.php/avatar/john/512/dark') + expect(getAvatarUrl('alice', { isDarkTheme: true })).toBe('//index.php/avatar/alice/64/dark?guestFallback=true') + expect(getAvatarUrl('john', { isDarkTheme: true, size: 512 })).toBe('//index.php/avatar/john/512/dark?guestFallback=true') }) it('should return correct relative URL for user avatar in bright mode if enforced but body is darkmode', () => { document.body.style.setProperty('--background-invert-if-dark', 'invert(100%)') - expect(getAvatarUrl('alice', { isDarkTheme: false })).toBe('//index.php/avatar/alice/64') - expect(getAvatarUrl('john', { isDarkTheme: false, size: 512 })).toBe('//index.php/avatar/john/512') + expect(getAvatarUrl('alice', { isDarkTheme: false })).toBe('//index.php/avatar/alice/64?guestFallback=true') + expect(getAvatarUrl('john', { isDarkTheme: false, size: 512 })).toBe('//index.php/avatar/john/512?guestFallback=true') }) it('should return correct relative URL for user avatar in dark mode', () => { document.body.style.setProperty('--background-invert-if-dark', 'invert(100%)') - expect(getAvatarUrl('alice')).toBe('//index.php/avatar/alice/64/dark') - expect(getAvatarUrl('john', { size: 64 })).toBe('//index.php/avatar/john/64/dark') + expect(getAvatarUrl('alice')).toBe('//index.php/avatar/alice/64/dark?guestFallback=true') + expect(getAvatarUrl('john', { size: 64 })).toBe('//index.php/avatar/john/64/dark?guestFallback=true') }) it('should return correct relative URL for guest avatar', () => { - expect(getAvatarUrl('alice', { isGuest: true })).toBe('//index.php/avatar/guest/alice/64') - expect(getAvatarUrl('john', { size: 64, isGuest: true })).toBe('//index.php/avatar/guest/john/64') + expect(getAvatarUrl('alice', { isGuest: true })).toBe('//index.php/avatar/guest/alice/64?guestFallback=true') + expect(getAvatarUrl('john', { size: 64, isGuest: true })).toBe('//index.php/avatar/guest/john/64?guestFallback=true') }) it('should return correct relative URL for guest avatar in dark mode', () => { document.body.style.setProperty('--background-invert-if-dark', 'invert(100%)') - expect(getAvatarUrl('alice', { isGuest: true })).toBe('//index.php/avatar/guest/alice/64/dark') - expect(getAvatarUrl('john', { size: 64, isGuest: true })).toBe('//index.php/avatar/guest/john/64/dark') + expect(getAvatarUrl('alice', { isGuest: true })).toBe('//index.php/avatar/guest/alice/64/dark?guestFallback=true') + expect(getAvatarUrl('john', { size: 64, isGuest: true })).toBe('//index.php/avatar/guest/john/64/dark?guestFallback=true') }) })