83 lines
2.2 KiB
JavaScript
83 lines
2.2 KiB
JavaScript
import VnImg from 'src/components/ui/VnImg.vue';
|
|
|
|
describe.only('<VnImg />', () => {
|
|
beforeEach(() => {
|
|
// Mock useSession composable
|
|
cy.stub(window, 'useSession').returns({
|
|
getTokenMultimedia: () => 'mock-token',
|
|
});
|
|
});
|
|
const mountComponent = (props = {}) => {
|
|
cy.createWrapper(VnImg, {
|
|
props,
|
|
});
|
|
};
|
|
|
|
it('renders with default props', () => {
|
|
mountComponent({ id: 1 });
|
|
cy.get('img')
|
|
.should('have.attr', 'src')
|
|
.and('include', 'Images')
|
|
.and('include', 'catalog')
|
|
.and('include', '200x200');
|
|
});
|
|
|
|
it('renders with custom storage and collection', () => {
|
|
mountComponent({
|
|
props: {
|
|
id: 1,
|
|
storage: 'CustomStorage',
|
|
collection: 'custom-collection',
|
|
resolution: '300x300',
|
|
},
|
|
});
|
|
cy.get('img')
|
|
.should('have.attr', 'src')
|
|
.and('include', 'CustomStorage')
|
|
.and('include', 'custom-collection')
|
|
.and('include', '300x300');
|
|
});
|
|
|
|
it('shows zoom functionality when enabled', () => {
|
|
mountComponent({
|
|
props: {
|
|
id: 1,
|
|
zoom: true,
|
|
zoomResolution: '800x800',
|
|
},
|
|
});
|
|
cy.get('img').click();
|
|
cy.get('.zoomed-image').should('exist');
|
|
});
|
|
|
|
it('disables zoom functionality when configured', () => {
|
|
mountComponent({
|
|
props: {
|
|
id: 1,
|
|
zoom: false,
|
|
},
|
|
});
|
|
cy.get('img').click();
|
|
cy.get('.zoomed-image').should('not.exist');
|
|
});
|
|
|
|
it('includes authentication token in image URL', () => {
|
|
mountComponent({
|
|
props: {
|
|
id: 1,
|
|
},
|
|
});
|
|
cy.get('img').should('have.attr', 'src').and('include', 'mock-token');
|
|
});
|
|
|
|
it('shows fallback image when loading fails', () => {
|
|
mountComponent({
|
|
props: {
|
|
id: 1,
|
|
},
|
|
});
|
|
cy.get('img').trigger('error');
|
|
cy.get('img').should('have.attr', 'src', '/no-user.png');
|
|
});
|
|
});
|