github.com/verdaccio
1
0
Fork 0
mirror of https://github.com/verdaccio/verdaccio.git synced 2024-11-08 23:25:51 +01:00
Code Releases Wiki Activity

test(e2e): add test scenario for sidebar

Browse Source
This commit is contained in:
Juan Picado @jotadeveloper 2018-02-11 00:02:14 +01:00
parent e91bb8e723
commit 66031363b9
No known key found for this signature in database
GPG Key ID: 18AC54485952D158
11 changed files with 16 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/webui/src/components/PackageSidebar/index.jsx
View File

@ -49,12 +49,12 @@ export default class PackageSidebar extends React.Component {
let {packageMeta} = this.state; let {packageMeta} = this.state;
return packageMeta ? return packageMeta ?
(<aside> (<aside className="sidebar-info">
<LastSync packageMeta={packageMeta} /> <LastSync packageMeta={packageMeta} />
<Maintainers packageMeta={packageMeta} /> <Maintainers packageMeta={packageMeta} />
<Dependencies packageMeta={packageMeta} /> <Dependencies packageMeta={packageMeta} />
{/* Package management module? Help us implement it! */} {/* Package management module? Help us implement it! */}
</aside>): </aside>):
(<aside>Loading package information...</aside>); (<aside className="sidebar-loading">Loading package information...</aside>);
} }
} }

2
src/webui/src/components/PackageSidebar/modules/Dependencies/index.jsx
View File

@ -33,7 +33,7 @@ export default class Dependencies extends React.Component {
{ {
dependenciesList.map((dependenceName, index) => { dependenciesList.map((dependenceName, index) => {
return ( return (
<li key={index} title={`Depend on version: ${dependencies[dependenceName]}`}> <li className="dependency-item" key={index} title={`Depend on version: ${dependencies[dependenceName]}`}>
<a href={getDetailPageURL(dependenceName)}>{dependenceName}</a> <a href={getDetailPageURL(dependenceName)}>{dependenceName}</a>
{index < dependenciesList.length - 1 && <span>,&nbsp;</span>} {index < dependenciesList.length - 1 && <span>,&nbsp;</span>}
</li> </li>

2
src/webui/src/components/PackageSidebar/modules/LastSync/index.jsx
View File

@ -43,7 +43,7 @@ export default class LastSync extends React.Component {
<ul> <ul>
{this.recentReleases.map((versionInfo) => { {this.recentReleases.map((versionInfo) => {
return ( return (
<li key={versionInfo.version}> <li className="last-sync-item" key={versionInfo.version}>
<span>{versionInfo.version}</span> <span>{versionInfo.version}</span>
<span>{versionInfo.time}</span> <span>{versionInfo.time}</span>
</li> </li>

2
src/webui/src/components/PackageSidebar/modules/Maintainers/MaintainerInfo/index.jsx
View File

@ -8,7 +8,7 @@ export default function MaintainerInfo({title, name, avatar}) {
return ( return (
<div className={classes.maintainer} title={name}> <div className={classes.maintainer} title={name}>
<img src={avatar} alt={avatarDescription} title={avatarDescription}/> <img src={avatar} alt={avatarDescription} title={avatarDescription}/>
<span>{name}</span> <span className="maintainer-name">{name}</span>
</div> </div>
); );
} }

2
src/webui/src/components/PackageSidebar/modules/Maintainers/index.jsx
View File

@ -65,7 +65,7 @@ export default class Maintainers extends React.Component {
title="Maintainers" title="Maintainers"
className={classes.maintainersModule} className={classes.maintainersModule}
> >
<ul> <ul className="maintainer-author">
{author && <MaintainerInfo title="Author" name={author.name} avatar={author.avatar}/>} {author && <MaintainerInfo title="Author" name={author.name} avatar={author.avatar}/>}
{this.renderContributors()} {this.renderContributors()}
</ul> </ul>

6
test/e2e/e2e.spec.js
View File

@ -123,10 +123,14 @@ describe('/ (Verdaccio Page)', () => {
await packageItem.focus(); await packageItem.focus();
await packageItem.click({clickCount: 1, delay: 200}); await packageItem.click({clickCount: 1, delay: 200});
await page.waitFor(1000); await page.waitFor(1000);
await page.screenshot({path: 'readme.png'});
const readmeText = await page.evaluate(() => document.querySelector('.markdown-body').textContent); const readmeText = await page.evaluate(() => document.querySelector('.markdown-body').textContent);
expect(readmeText).toMatch('test'); expect(readmeText).toMatch('test');
}); });
it('should contains last sync information', async () => {
const versionList = await page.$$('.sidebar-info .last-sync-item');
expect(versionList).toHaveLength(3);
});
}); });

2
test/webui/components/PackageSidebar/__snapshots__/dependencies.spec.js.snap
View File

@ -1,3 +1,3 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP // Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`<PackageSidebar /> : <Dependencies /> should load the package and match snapshot 1`] = `"<div class=\\"module dependenciesModule\\"><h2 class=\\"moduleTitle\\">Dependencies</h2><div><ul><li title=\\"Depend on version: 0.0.3\\"><a href=\\"nullblank/#/detail/@verdaccio/file-locking\\">@verdaccio/file-locking</a><span>, </span></li><li title=\\"Depend on version: 0.0.2\\"><a href=\\"nullblank/#/detail/@verdaccio/streams\\">@verdaccio/streams</a><span>, </span></li><li title=\\"Depend on version: ^1.1.1\\"><a href=\\"nullblank/#/detail/JSONStream\\">JSONStream</a><span>, </span></li><li title=\\"Depend on version: ^1.1.2\\"><a href=\\"nullblank/#/detail/apache-md5\\">apache-md5</a><span>, </span></li><li title=\\"Depend on version: ^2.0.1\\"><a href=\\"nullblank/#/detail/async\\">async</a><span>, </span></li><li title=\\"Depend on version: ^1.15.0\\"><a href=\\"nullblank/#/detail/body-parser\\">body-parser</a><span>, </span></li><li title=\\"Depend on version: ^1.8.0\\"><a href=\\"nullblank/#/detail/bunyan\\">bunyan</a><span>, </span></li><li title=\\"Depend on version: ^2.0.1\\"><a href=\\"nullblank/#/detail/chalk\\">chalk</a><span>, </span></li><li title=\\"Depend on version: ^2.11.0\\"><a href=\\"nullblank/#/detail/commander\\">commander</a><span>, </span></li><li title=\\"Depend on version: 1.6.2\\"><a href=\\"nullblank/#/detail/compression\\">compression</a><span>, </span></li><li title=\\"Depend on version: ^0.7.0\\"><a href=\\"nullblank/#/detail/cookies\\">cookies</a><span>, </span></li><li title=\\"Depend on version: ^2.8.3\\"><a href=\\"nullblank/#/detail/cors\\">cors</a><span>, </span></li><li title=\\"Depend on version: 4.15.3\\"><a href=\\"nullblank/#/detail/express\\">express</a><span>, </span></li><li title=\\"Depend on version: ^4.3.2\\"><a href=\\"nullblank/#/detail/global\\">global</a><span>, </span></li><li title=\\"Depend on version: 4.0.5\\"><a href=\\"nullblank/#/detail/handlebars\\">handlebars</a><span>, </span></li><li title=\\"Depend on version: ^1.4.0\\"><a href=\\"nullblank/#/detail/http-errors\\">http-errors</a><span>, </span></li><li title=\\"Depend on version: 1.0.1\\"><a href=\\"nullblank/#/detail/js-string-escape\\">js-string-escape</a><span>, </span></li><li title=\\"Depend on version: ^3.6.0\\"><a href=\\"nullblank/#/detail/js-yaml\\">js-yaml</a><span>, </span></li><li title=\\"Depend on version: ^7.4.1\\"><a href=\\"nullblank/#/detail/jsonwebtoken\\">jsonwebtoken</a><span>, </span></li><li title=\\"Depend on version: ^1.0.1\\"><a href=\\"nullblank/#/detail/lockfile\\">lockfile</a><span>, </span></li><li title=\\"Depend on version: 4.17.4\\"><a href=\\"nullblank/#/detail/lodash\\">lodash</a><span>, </span></li><li title=\\"Depend on version: ^0.7.0\\"><a href=\\"nullblank/#/detail/lunr\\">lunr</a><span>, </span></li><li title=\\"Depend on version: 0.3.6\\"><a href=\\"nullblank/#/detail/marked\\">marked</a><span>, </span></li><li title=\\"Depend on version: ^1.3.6\\"><a href=\\"nullblank/#/detail/mime\\">mime</a><span>, </span></li><li title=\\"Depend on version: ^3.0.2\\"><a href=\\"nullblank/#/detail/minimatch\\">minimatch</a><span>, </span></li><li title=\\"Depend on version: ^0.5.1\\"><a href=\\"nullblank/#/detail/mkdirp\\">mkdirp</a><span>, </span></li><li title=\\"Depend on version: ^0.4.0\\"><a href=\\"nullblank/#/detail/pkginfo\\">pkginfo</a><span>, </span></li><li title=\\"Depend on version: ^2.72.0\\"><a href=\\"nullblank/#/detail/request\\">request</a><span>, </span></li><li title=\\"Depend on version: ^5.1.0\\"><a href=\\"nullblank/#/detail/semver\\">semver</a><span>, </span></li><li title=\\"Depend on version: ^1.0.0\\"><a href=\\"nullblank/#/detail/unix-crypt-td-js\\">unix-crypt-td-js</a></li></ul></div></div>"`; exports[`<PackageSidebar /> : <Dependencies /> should load the package and match snapshot 1`] = `"<div class=\\"module dependenciesModule\\"><h2 class=\\"moduleTitle\\">Dependencies</h2><div><ul><li class=\\"dependency-item\\" title=\\"Depend on version: 0.0.3\\"><a href=\\"nullblank/#/detail/@verdaccio/file-locking\\">@verdaccio/file-locking</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: 0.0.2\\"><a href=\\"nullblank/#/detail/@verdaccio/streams\\">@verdaccio/streams</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^1.1.1\\"><a href=\\"nullblank/#/detail/JSONStream\\">JSONStream</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^1.1.2\\"><a href=\\"nullblank/#/detail/apache-md5\\">apache-md5</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^2.0.1\\"><a href=\\"nullblank/#/detail/async\\">async</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^1.15.0\\"><a href=\\"nullblank/#/detail/body-parser\\">body-parser</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^1.8.0\\"><a href=\\"nullblank/#/detail/bunyan\\">bunyan</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^2.0.1\\"><a href=\\"nullblank/#/detail/chalk\\">chalk</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^2.11.0\\"><a href=\\"nullblank/#/detail/commander\\">commander</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: 1.6.2\\"><a href=\\"nullblank/#/detail/compression\\">compression</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^0.7.0\\"><a href=\\"nullblank/#/detail/cookies\\">cookies</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^2.8.3\\"><a href=\\"nullblank/#/detail/cors\\">cors</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: 4.15.3\\"><a href=\\"nullblank/#/detail/express\\">express</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^4.3.2\\"><a href=\\"nullblank/#/detail/global\\">global</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: 4.0.5\\"><a href=\\"nullblank/#/detail/handlebars\\">handlebars</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^1.4.0\\"><a href=\\"nullblank/#/detail/http-errors\\">http-errors</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: 1.0.1\\"><a href=\\"nullblank/#/detail/js-string-escape\\">js-string-escape</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^3.6.0\\"><a href=\\"nullblank/#/detail/js-yaml\\">js-yaml</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^7.4.1\\"><a href=\\"nullblank/#/detail/jsonwebtoken\\">jsonwebtoken</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^1.0.1\\"><a href=\\"nullblank/#/detail/lockfile\\">lockfile</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: 4.17.4\\"><a href=\\"nullblank/#/detail/lodash\\">lodash</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^0.7.0\\"><a href=\\"nullblank/#/detail/lunr\\">lunr</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: 0.3.6\\"><a href=\\"nullblank/#/detail/marked\\">marked</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^1.3.6\\"><a href=\\"nullblank/#/detail/mime\\">mime</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^3.0.2\\"><a href=\\"nullblank/#/detail/minimatch\\">minimatch</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^0.5.1\\"><a href=\\"nullblank/#/detail/mkdirp\\">mkdirp</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^0.4.0\\"><a href=\\"nullblank/#/detail/pkginfo\\">pkginfo</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^2.72.0\\"><a href=\\"nullblank/#/detail/request\\">request</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^5.1.0\\"><a href=\\"nullblank/#/detail/semver\\">semver</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^1.0.0\\"><a href=\\"nullblank/#/detail/unix-crypt-td-js\\">unix-crypt-td-js</a></li></ul></div></div>"`;

2
test/webui/components/PackageSidebar/__snapshots__/lastsync.spec.js.snap
View File

@ -1,3 +1,3 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP // Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`<PackageSidebar /> : <LastSync /> should load the LastSync component and match snapshot 1`] = `"<div class=\\"module releasesModule\\"><h2 class=\\"moduleTitle\\">Last Sync<span>Dec 14, 2017, 3:43 PM</span></h2><div><ul><li><span>2.7.1</span><span>Dec 14, 2017, 3:43 PM</span></li><li><span>2.7.0</span><span>Dec 5, 2017, 11:25 PM</span></li><li><span>2.6.6</span><span>Nov 8, 2017, 10:47 PM</span></li></ul></div></div>"`; exports[`<PackageSidebar /> : <LastSync /> should load the LastSync component and match snapshot 1`] = `"<div class=\\"module releasesModule\\"><h2 class=\\"moduleTitle\\">Last Sync<span>Dec 14, 2017, 3:43 PM</span></h2><div><ul><li class=\\"last-sync-item\\"><span>2.7.1</span><span>Dec 14, 2017, 3:43 PM</span></li><li class=\\"last-sync-item\\"><span>2.7.0</span><span>Dec 5, 2017, 11:25 PM</span></li><li class=\\"last-sync-item\\"><span>2.6.6</span><span>Nov 8, 2017, 10:47 PM</span></li></ul></div></div>"`;

2
test/webui/components/PackageSidebar/__snapshots__/maintainerInfo.spec.js.snap
View File

@ -1,3 +1,3 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP // Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`<PackageSidebar /> : <Maintainers /> <MaintainerInfo /> should load the component and match with snapshot 1`] = `"<div class=\\"maintainer\\" title=\\"test\\"><img src=\\"http://xyz.com/profile.jpg\\" alt=\\"test-title test&#x27;s avatar\\" title=\\"test-title test&#x27;s avatar\\"/><span>test</span></div>"`; exports[`<PackageSidebar /> : <Maintainers /> <MaintainerInfo /> should load the component and match with snapshot 1`] = `"<div class=\\"maintainer\\" title=\\"test\\"><img src=\\"http://xyz.com/profile.jpg\\" alt=\\"test-title test&#x27;s avatar\\" title=\\"test-title test&#x27;s avatar\\"/><span class=\\"maintainer-name\\">test</span></div>"`;

2
test/webui/components/PackageSidebar/__snapshots__/maintainers.spec.js.snap
View File

@ -1,3 +1,3 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP // Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`<PackageSidebar /> : <Maintainers /> should match with the props 1`] = `"<div class=\\"module maintainersModule\\"><h2 class=\\"moduleTitle\\">Maintainers</h2><div><ul><div class=\\"maintainer\\" title=\\"Alex Kocharin\\"><img src=\\"https://www.gravatar.com/avatar/a5a236ba477ee98908600c40cda74f4a\\" alt=\\"Author Alex Kocharin's avatar\\" title=\\"Author Alex Kocharin's avatar\\"><span>Alex Kocharin</span></div><div class=\\"maintainer\\" title=\\"030\\"><img src=\\"https://www.gravatar.com/avatar/4ef03c2bf8d8689527903212d96fb45b\\" alt=\\"Contributors 030's avatar\\" title=\\"Contributors 030's avatar\\"><span>030</span></div><div class=\\"maintainer\\" title=\\"Alex Vernacchia\\"><img src=\\"https://www.gravatar.com/avatar/06975001f7f2be7052bcf978700c6112\\" alt=\\"Contributors Alex Vernacchia's avatar\\" title=\\"Contributors Alex Vernacchia's avatar\\"><span>Alex Vernacchia</span></div><div class=\\"maintainer\\" title=\\"Alexander Makarenko\\"><img src=\\"https://www.gravatar.com/avatar/d9acfc4ed4e49a436738ff26a722dce4\\" alt=\\"Contributors Alexander Makarenko's avatar\\" title=\\"Contributors Alexander Makarenko's avatar\\"><span>Alexander Makarenko</span></div><div class=\\"maintainer\\" title=\\"Alexandre-io\\"><img src=\\"https://www.gravatar.com/avatar/2e095c7cfd278f72825d0fed6e12e3b1\\" alt=\\"Contributors Alexandre-io's avatar\\" title=\\"Contributors Alexandre-io's avatar\\"><span>Alexandre-io</span></div><div class=\\"maintainer\\" title=\\"Aram Drevekenin\\"><img src=\\"https://www.gravatar.com/avatar/371edff6d79c39bb9e36bde39d41a4b0\\" alt=\\"Contributors Aram Drevekenin's avatar\\" title=\\"Contributors Aram Drevekenin's avatar\\"><span>Aram Drevekenin</span></div></ul><button class=\\"showAllContributors\\" title=\\"Current list only show the author and first 5 contributors unique by name\\">Show all contributor</button></div></div>"`; exports[`<PackageSidebar /> : <Maintainers /> should match with the props 1`] = `"<div class=\\"module maintainersModule\\"><h2 class=\\"moduleTitle\\">Maintainers</h2><div><ul class=\\"maintainer-author\\"><div class=\\"maintainer\\" title=\\"Alex Kocharin\\"><img src=\\"https://www.gravatar.com/avatar/a5a236ba477ee98908600c40cda74f4a\\" alt=\\"Author Alex Kocharin's avatar\\" title=\\"Author Alex Kocharin's avatar\\"><span class=\\"maintainer-name\\">Alex Kocharin</span></div><div class=\\"maintainer\\" title=\\"030\\"><img src=\\"https://www.gravatar.com/avatar/4ef03c2bf8d8689527903212d96fb45b\\" alt=\\"Contributors 030's avatar\\" title=\\"Contributors 030's avatar\\"><span class=\\"maintainer-name\\">030</span></div><div class=\\"maintainer\\" title=\\"Alex Vernacchia\\"><img src=\\"https://www.gravatar.com/avatar/06975001f7f2be7052bcf978700c6112\\" alt=\\"Contributors Alex Vernacchia's avatar\\" title=\\"Contributors Alex Vernacchia's avatar\\"><span class=\\"maintainer-name\\">Alex Vernacchia</span></div><div class=\\"maintainer\\" title=\\"Alexander Makarenko\\"><img src=\\"https://www.gravatar.com/avatar/d9acfc4ed4e49a436738ff26a722dce4\\" alt=\\"Contributors Alexander Makarenko's avatar\\" title=\\"Contributors Alexander Makarenko's avatar\\"><span class=\\"maintainer-name\\">Alexander Makarenko</span></div><div class=\\"maintainer\\" title=\\"Alexandre-io\\"><img src=\\"https://www.gravatar.com/avatar/2e095c7cfd278f72825d0fed6e12e3b1\\" alt=\\"Contributors Alexandre-io's avatar\\" title=\\"Contributors Alexandre-io's avatar\\"><span class=\\"maintainer-name\\">Alexandre-io</span></div><div class=\\"maintainer\\" title=\\"Aram Drevekenin\\"><img src=\\"https://www.gravatar.com/avatar/371edff6d79c39bb9e36bde39d41a4b0\\" alt=\\"Contributors Aram Drevekenin's avatar\\" title=\\"Contributors Aram Drevekenin's avatar\\"><span class=\\"maintainer-name\\">Aram Drevekenin</span></div></ul><button class=\\"showAllContributors\\" title=\\"Current list only show the author and first 5 contributors unique by name\\">Show all contributor</button></div></div>"`;

2
test/webui/components/PackageSidebar/__snapshots__/packageSidebar.spec.js.snap
View File

@ -1,3 +1,3 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP // Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`<PackageSidebar /> component should load the packageMeta 1`] = `"<aside>Loading package information...</aside>"`; exports[`<PackageSidebar /> component should load the packageMeta 1`] = `"<aside class=\\"sidebar-loading\\">Loading package information...</aside>"`;