Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add documentation on how to use ng-apimock with other testing frameworks than protractor #32

Open
sandervalstar opened this issue Nov 30, 2017 · 2 comments

Comments

@sandervalstar
Copy link

I'm working on a project where I wanted to do the testing using Cypress: https://www.cypress.io/
It took me some time to figure out how to best integrate Cypress and ng-apimock, but this is what I ended up doing:

Assuming ng-apimock is running on port 8101. Define the following custom cypress commands in
cypress/support/commands.js:

Cypress.Commands.add("selectScenario", function (identifier, scenario) {
  cy.request("PUT", 'http://localhost:8101/ngapimock/mocks', JSON.stringify({
    identifier: identifier,
    scenario: scenario
  }))
});

Cypress.Commands.add("resetScenariosToDefaults", function () {
  cy.request("PUT", 'http://localhost:8101/ngapimock/mocks/defaults', null);
});

You can then use these commands in your tests as follows:
cypress/integration/example_spec.js:

cy.selectScenario('yourMockName', 'yourScenarioName');
cy.resetScenariosToDefaults();

I'd love to hear if I should be doing something differently. If you agree this is the correct way of integrating ng-apimock with Cypress could you add this to the ng-apimock documentation?

It would be super awesome if there is some kind of cypress-commands.js file in the ng-apimock package which we can simply import in cypress/support/commands.js

I believe implementing that would look something like this:
ng-apimock/lib/cypress/cypress-commands.js:

module.exports = function setupCustomCommands(host, port) {
  const baseUrl = `http://${host}:${port}/ngapimock/mocks`;

  Cypress.Commands.add("selectScenario", function (identifier, scenario) {
    cy.request("PUT", baseUrl, JSON.stringify({
      identifier: identifier,
      scenario: scenario
    }))
  });

  Cypress.Commands.add("resetScenariosToDefaults", function () {
    cy.request("PUT", `${baseUrl}/defaults`, null);
  });

}

cypress/support/commands.js:

const setupCustomCommands = require('ng-apimock/lib/cypress/cypress-commands');
setupCustomCommands('localhost', '8101');

I think it would be cooler though if we don't have to pass in the host and port, because ng-apimock should already know where it is running.

@wswebcreation
Copy link
Collaborator

Hi @sandervalstar

Nice that you are also trying to use ng-Apimock with a different framework then Protractor. I'm currently also investigating the use of ng-Apimock with Webdriver.io i.c.m. native mobile apps.
I also talked about this with @mdasberg to pull out some logic from ng-Apimock template for Protractor to a more generic api that can be used by any framework. This will definitely help in getting that done ;-)

@rajjaiswalsaumya
Copy link

Is there a document how to use ngapimock with cypress? I am getting error for selectCommand that i defined as defined on site.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants