https://cypress.io logo
Join Discord
Powered by
# e2e-testing
  • l
    Hello! anybody know If I can use hookCalls in a test?
  • l
    Copy code
    js
import { useTranslation } from 'react-i18next';

describe('Open App', () => {
  const { t } = useTranslation();
  beforeEach(() => {
    cy.visit('/');
  });
  it('Frontpage can be opened', () => {
    cy.contains('example@gmail.com');
  });

  it('Login can be opened', () => {
    cy.get('input:first').type('adrianmsm91@gmail.com');
    cy.get('input:last').type('111111');
    cy.contains(t('pages.authentication.login.signIn')).click();
  });
});
  • l
    Having problem with this
  • a
    Hello ! I am trying to convert monolith to app using NX and my folder structure is X-e2e/src/integration/** where I have both feature file and the the step definitions(JS). I am using 9.6.0 here but every time getting "Step implementation missing for" error. Unfortunately, it's unable to find the right file. Here is my package.json configuration "cypress-cucumber-preprocessor": { "nonGlobalStepDefinitions": true, "stepDefinitions": "./src/integration" }, Any help would be appreciated!
  • c
    can I test electron app in cypress
  • n
    yeah, so basically that's the correct usage of custom commands, to reuse some piece of steps by calling a single function. A little advice, try to not overengineer it. Not saying it's an issue in your case but I've seen a lot of complex and general usage commands that were very difficult to maintain and debug later on.
  • n
    I don't think it's possible as 
    react-i18next
    is a library for react framework. Keep in mind, that your Cypress tests are kinda another application that is being run to evaluate the react one. These two pieces do not share a state or anything like this. They are two independent processes but within the same repository. Also, if I might suggest, I'd not search elements by text if it's possible and that's what you're trying to do. Instead, try to use a css locator or ask the developers to add a custom one only for testing purposes. I hope it makes sense
  • m
  • b
    I agree with you. Yes, cypress offers this "simple and banal" way to select, but this one should rather be forgotten. With nests and a defined test-id the way is
  • b
    can you explain me, what does component test in cypress 10..
  • b
    i see other thread
  • m
    instead of a webpage, mounts a component into the dom a lot more isolated, lower level, single component at a time vs the larger part of the app
  • m
    since there is the real DOM, most the time you don't loose confidence vs the e2e, and win with speed, isolation and stability
  • b
    mhh
  • b
    that sounds good for azure ci
  • m
    in the meta I think Cypress suites will be 80 % component tests vs 20% e2e, and the e2e will be things that don't give enough confidence or aren't possible at a lower level
  • m
    that's good for anything, ci isn't really in context
  • b
    oh..then i misunderstood something. i better read into it a bit
  • b
    well, as i understand, cypress is replacing jest with the 10 version.
  • m
    nobody in Cypress is making that statement, but I'll tell you that I have not had trouble 1:1 converting anything from RTL to Cypress yet. We'll see how things are in the real world. I'm sure there are some edge cases and the Cypress team would love to take a look. I think it even replaces Storybook as far as developers are concerned...
  • b
    any idea how to find file input tag in specific div? I mean i have 2 file upload option in one page. so get file input gets the first one. how can i get the second one?
  • b
    sure, there some ways. Simple, get the div by css class, better you give them cypress-"id"
  • b
    well i just solved it by getting the dive of the heading of that field then using next i go to that input field and attach file. looks like cheating but hay doing the job xD
  • b
    cy.contains('div','Dokument hinzufügen').next().next().attachFile("invoice.png");
  • b
    holzweg, aber ja geht auch
  • b
    but not too recommended
  • b
    the problem is i have to get it by previous div since both of the input field are same way coded.
  • n
    Glad to hear you solved the problem but imho it's very fragile. If adding a custom id as @bitter-match-90736 suggested is not an option, I'd prefer to depend on regular ids or element types (e.g. div, button etc.) than on text
  • b
    yeah the person who coded the frontend didnt do a good job of keeping these uniqe
  • b
    and if you have 10 buttons? so give them data-cy add-button, so you have it
1...707172...192Latest