diff --git a/cypress/support/commands.js b/cypress/support/commands.js index a2c55a394..17c7f0689 100644 --- a/cypress/support/commands.js +++ b/cypress/support/commands.js @@ -140,3 +140,59 @@ Cypress.Commands.add( ); }, ); + +/** + * Creates an article. + * + * @param {string} title The title of an article. + * @param {Array} [tags=[]] The tags of an article. + * @param {string} [content=''] The content of the article. + * @param {boolean} [published=true] Whether or not an article should be published. + * @param {string} [description=''] The description of the article. + * @param {string} [canonicalUrl=''] The canonical URL for the article. + * @param {string} [series=''] The series the article is associated with. + * @param {string} [allSeries=[]] The list of available series the article can be a part of. + * @param {string} [organizations=[]] The list of organizations the author of the article belongs to. + * @param {string} [organizationId=null] The selected organization's ID to create the article under. + * @param {'v1'|'v2'} [editorVersion='v2'] The editor version. + * + * @returns {Cypress.Chainable} A cypress request for creating an article. + */ +Cypress.Commands.add( + 'createArticle', + ({ + title, + tags = [], + content = '', + published = true, + description = '', + canonicalUrl = '', + series = '', + allSeries = [], + organizations = [], + organizationId = null, + editorVersion = 'v2', + }) => { + return cy.request('POST', '/articles', { + article: { + id: null, + title, + tagList: tags.join(','), + description, + canonicalUrl, + series, + allSeries, + bodyMarkdown: content, + published, + submitting: false, + editing: false, + mainImage: null, + organizations, + organizationId, + edited: true, + updatedAt: null, + version: editorVersion, + }, + }); + }, +); diff --git a/docs/tests/e2e-tests.md b/docs/tests/e2e-tests.md index d9aa40daa..6ce3a52c4 100644 --- a/docs/tests/e2e-tests.md +++ b/docs/tests/e2e-tests.md @@ -108,6 +108,42 @@ Pro as there were issues integrating the cypress-rails gem with the [knapsack-pro-cypress](https://github.com/KnapsackPro/knapsack-pro-cypress) npm package. +## Cypress Custom commands + +[Cypress custom commands](https://docs.cypress.io/api/cypress-api/custom-commands.html) +allow you to extend the functionality of the E2E testing framework. In the case +of Forem, we need custom commands to create an article, for example. + +A custom command is prefixed like any Cypress command by `cy.` All custom +commands can be found in the +[commands.js](https://github.com/forem/forem/blob/master/cypress/support/commands.js) file. + +### Creating a Custom Article Command + +To create an article as part of your test's setup, use the `cy.createArticle` +custom command. It can be called like so: + +```javascript +cy.createArticle({ + title: 'Test Article', + tags: ['beginner', 'discuss'], // tags are optional + content: 'This is a test article', +}); +``` + +If you want to do something with the article creation's response, you can call +it like so. + +```javascript +cy.createArticle({ + title: 'Test Article', + tags: ['beginner', 'discuss'], // tags are optional + content: 'This is a test article', +}).then((response) => { + cy.visit(response.body.current_state_path); // path to article +}); +``` + ## Additional Resources - [Cypress documentation](https://docs.cypress.io)