diff --git a/codecept.conf.js b/codecept.conf.js new file mode 100644 index 0000000..72501fd --- /dev/null +++ b/codecept.conf.js @@ -0,0 +1,22 @@ + +exports.config = { + tests: './test/acceptance/*_test.js', + output: './test/acceptance/output', + helpers: { + Puppeteer: { + url: 'http://localhost:8080', + // "show": true, + chrome: { + // headless: false + } + } + }, + include: { + I: './test/acceptance/steps_file.js' + }, + smartWait: 30000, + bootstrap: null, + plugins: {}, + mocha: {}, + name: '@verdaccio/ui-theme' +} diff --git a/package.json b/package.json index 9e32af3..915d7f0 100644 --- a/package.json +++ b/package.json @@ -28,9 +28,10 @@ "@verdaccio/eslint-config": "2.0.0", "@verdaccio/types": "7.0.0", "autosuggest-highlight": "3.1.1", - "babel-loader": "8.0.6", "bundlesize": "0.18.0", + "codeceptjs": "2.1.0", "codecov": "3.5.0", + "babel-loader": "8.0.6", "concurrently": "4.1.0", "cross-env": "5.2.0", "css-loader": "0.28.10", @@ -136,7 +137,10 @@ "type-check": "tsc --noEmit", "type-check:watch": "npm run type-check -- --watch", "release": "standard-version -a -s", - "test": "cross-env NODE_ENV=test BABEL_ENV=test TZ=UTC jest --config ./jest/jest.config.js --maxWorkers 2", + "test:clean": "npx jest --clearCache", + "test:acceptance": "codeceptjs run --steps", + "test:acceptance:server": "concurrently --kill-others \"npm run verdaccio:server\" \"npm run test:acceptance\"", + "test": "cross-env NODE_ENV=test BABEL_ENV=test TZ=UTC jest --config ./jest/jest.config.js --maxWorkers 2 --passWithNoTests", "test:size": "bundlesize", "lint": "npm run lint:js && npm run lint:css", "lint:js": "npm run type-check && eslint . --ext .js,.ts,.tsx", diff --git a/src/components/Repository/Repository.test.tsx b/src/components/Repository/Repository.test.tsx index 73d14f9..e07f8be 100644 --- a/src/components/Repository/Repository.test.tsx +++ b/src/components/Repository/Repository.test.tsx @@ -1,11 +1,68 @@ import React from 'react'; import { shallow } from 'enzyme'; -import Repository from './Repository'; +jest.mock('./img/git.png', () => ''); describe(' component', () => { + beforeEach(() => { + jest.resetModules(); + }); + test('should render the component in default state', () => { + const packageMeta = { + latest: { + repository: { + type: 'git', + url: 'git+https://github.com/verdaccio/ui.git', + }, + }, + }; + + jest.doMock('../../pages/version/Version', () => ({ + DetailContextConsumer: component => { + return component.children({ packageMeta }); + }, + })); + + const Repository = require('./Repository').default; const wrapper = shallow(); expect(wrapper.html()).toMatchSnapshot(); }); + + test('should render the component in with no repository data', () => { + const packageMeta = { + latest: {}, + }; + + jest.doMock('../../pages/version/Version', () => ({ + DetailContextConsumer: component => { + return component.children({ packageMeta }); + }, + })); + + const Repository = require('./Repository').default; + const wrapper = shallow(); + expect(wrapper.html()).toEqual(''); + }); + + test('should render the component in with invalid url', () => { + const packageMeta = { + latest: { + repository: { + type: 'git', + url: 'git://github.com/verdaccio/ui.git', + }, + }, + }; + + jest.doMock('../../pages/version/Version', () => ({ + DetailContextConsumer: component => { + return component.children({ packageMeta }); + }, + })); + + const Repository = require('./Repository').default; + const wrapper = shallow(); + expect(wrapper.html()).toEqual(''); + }); }); diff --git a/src/components/Repository/__snapshots__/Repository.test.tsx.snap b/src/components/Repository/__snapshots__/Repository.test.tsx.snap index 8fbdcc8..193dd0b 100644 --- a/src/components/Repository/__snapshots__/Repository.test.tsx.snap +++ b/src/components/Repository/__snapshots__/Repository.test.tsx.snap @@ -1,3 +1,3 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP -exports[` component should render the component in default state 1`] = `""`; +exports[` component should render the component in default state 1`] = `""`; diff --git a/test/acceptance/.gitignore b/test/acceptance/.gitignore new file mode 100644 index 0000000..53752db --- /dev/null +++ b/test/acceptance/.gitignore @@ -0,0 +1 @@ +output diff --git a/test/acceptance/Menu_test.js b/test/acceptance/Menu_test.js new file mode 100644 index 0000000..8716104 --- /dev/null +++ b/test/acceptance/Menu_test.js @@ -0,0 +1,9 @@ +Feature('Menu'); + +Scenario('check if we find the npm commands to set the registry', (I) => { + I.amOnPage('http://localhost:8080'); + I.waitForElement('#header--button-registryInfo', 5); + I.click('#header--button-registryInfo'); + I.waitForElement('#registryInfo--dialog-container'); + I.see('npm set registry http://localhost:8080'); +}); diff --git a/test/acceptance/SearchResult_test.js b/test/acceptance/SearchResult_test.js new file mode 100644 index 0000000..9d29752 --- /dev/null +++ b/test/acceptance/SearchResult_test.js @@ -0,0 +1,10 @@ +Feature('SearchResult'); + +Scenario('check if we get the "no results found" text', (I) => { + I.amOnPage('http://localhost:8080'); + I.seeElement('header .react-autosuggest__input input'); + I.fillField('header .react-autosuggest__input input', 'test'); + I.waitForElement('header .react-autosuggest__suggestions-container'); + I.wait(1); + I.see('No results found.', 'header .react-autosuggest__suggestions-container'); +}); diff --git a/test/acceptance/steps_file.js b/test/acceptance/steps_file.js new file mode 100644 index 0000000..fe0d4d5 --- /dev/null +++ b/test/acceptance/steps_file.js @@ -0,0 +1,11 @@ + +// in this file you can append custom step methods to 'I' object + +module.exports = function() { + return actor({ + + // Define custom steps here, use 'this' to access default methods of I. + // It is recommended to place a general 'login' function here. + + }); +}