describe('checkout-combined', () => {
    beforeEach(() => {
        cy.visit({ url: '/inject-metadata' });
    });

    it('should load the page', () => {
        cy.title().should('eq', 'Test Inject Metadata');
    });

    it('should inject the card iframe into the page', () => {
        cy.get('iframe#card');
    });

    it('should be call the on-ready hook', () => {
        cy.get('#events-onReady-true');
    });

    it('should call the on-change hook', () => {
        cy.get('#events-onReady-true');
        cy.get('#submit').click();
        cy.get('#key-onChange');
        cy.get('#token-data-code-invalid-payment-card');
    });

    it('should show provided data in token', () => {
        cy.get('#events-onReady-true');

        cy.iframe('iframe#card').within(() => {
            const cardNumber = '4111111111111111';
            const expiry =
                String('0' + (new Date().getMonth() + 1)).substr(-2) +
                String(new Date().getFullYear()).substr(-2);
            const cvv = '123';

            cy.findByTestId('cardnumber').type(cardNumber);
            cy.findByTestId('exp-date').type(expiry);
            cy.findByTestId('cvv').type(cvv);
        });

        cy.get('#submit').click();

        cy.get('#token-data-fingerprint')
            .invoke('text')
            .should((fingerprint) => {
                expect(fingerprint).to.equal('fingerprint123');
            });
    });
});
