Сравните две строки изображений base64 в Cypress

Question

Я хотел бы сравнить две следующие строки base64, чтобы убедиться, что фотография загружена как положено. Как бы я это сделал? Это мой код ниже, в настоящее время я получаю сообщение об ошибке:

You attempted to make a chai-jQuery assertion on an object that is neither a DOM object or a jQuery object.

The chai-jQuery assertion you used was:

  > text

Это мой код:

it('should allow the user to select a navbar component and replace a logo', () => {
  cy.getIframeBody('builder-showcase').find('[data-cy="navbar-component"]').eq(0).click();
  cy.getIframeBody('builder-showcase').find('[data-cy="navbar-logo-image"]').eq(0).click();
  cy.get('[data-cy="builder-sidebar-menu-select-image-navbar"]').eq(0).click();
  const navbarLogoImage = 'navbar-logo-image.png';
  cy.fixture(navbarLogoImage).then(originalLogoImage => {
    cy.get('[data-cy="image-file-input"]').attachFile(navbarLogoImage);
    cy.get('[data-cy="image-alt-text"]')
      .clear()
      .type('Twitter logo image');
    cy.get('.source-image').invoke('attr', 'src')
      .then(uploadedLogoImage => {
        expect(uploadedLogoImage).to.have.text(originalLogoImage);
      })
  });
});

Answer 1

Chai chainer to.have.text проверяет, что элемент (DOM или JQuery) содержит ожидаемый текст. Ваш uploadedLogoImage является строкой. Затем вы должны использовать цепочку, которая будет работать с такой строкой, как:

expect(uploadedLogoImage).to.eq(originalLogoImage);

или

expect(uploadedLogoImage).to.contain(originalLogoImage);

или с should(), вы можете запросить элемент напрямую:

cy.get('.source-image').should('have.attr', 'src', originalLogoImage);

Подсказка: вместо использования eq(0) вы также можете использовать first(), что обеспечивает лучшую читаемость.