opds-web-client
Version:
210 lines (209 loc) • 9.64 kB
JavaScript
var chai_1 = require("chai");
var sinon_1 = require("sinon");
var React = require("react");
var enzyme_1 = require("enzyme");
var Collection_1 = require("../Collection");
var Lanes_1 = require("../Lanes");
var Book_1 = require("../Book");
var FacetGroup_1 = require("../FacetGroup");
var SkipNavigationLink_1 = require("../SkipNavigationLink");
var collectionData_1 = require("./collectionData");
var routing_1 = require("./routing");
describe("Collection", function () {
describe("empty collection", function () {
it("says the collection is empty", function () {
var collectionData = Object.assign({}, collectionData_1.groupedCollectionData, { lanes: [] });
var wrapper = enzyme_1.shallow(React.createElement(Collection_1.default, { collection: collectionData }));
chai_1.expect(wrapper.text()).to.equal("No books here.");
});
});
describe("collection with lanes", function () {
var collectionData = collectionData_1.groupedCollectionData;
var wrapper;
beforeEach(function () {
wrapper = enzyme_1.shallow(React.createElement(Collection_1.default, { collection: collectionData }));
});
it("contains main div", function () {
var link = wrapper.find("#collection-main");
chai_1.expect(link.length).to.equal(1);
});
it("shows lanes", function () {
var lanes = wrapper.find(Lanes_1.Lanes);
chai_1.expect(lanes.props().url).to.equal(collectionData.url);
chai_1.expect(lanes.props().lanes).to.equal(collectionData.lanes);
});
});
describe("collection without lanes", function () {
var collectionData = collectionData_1.ungroupedCollectionData;
var wrapper;
beforeEach(function () {
wrapper = enzyme_1.shallow(React.createElement(Collection_1.default, { collection: collectionData }));
});
it("contains main div", function () {
var link = wrapper.find("#collection-main");
chai_1.expect(link.length).to.equal(1);
});
it("shows books in order", function () {
var books = wrapper.find(Book_1.default);
var bookDatas = books.map(function (book) { return book.props().book; });
var uniqueCollectionUrls = Array.from(new Set(books.map(function (book) { return book.props().collectionUrl; })));
chai_1.expect(books.length).to.equal(collectionData.books.length);
chai_1.expect(bookDatas).to.deep.equal(collectionData.books);
chai_1.expect(uniqueCollectionUrls).to.deep.equal([collectionData.url]);
});
});
describe("collection with facetGroups", function () {
var collectionData, wrapper;
beforeEach(function () {
collectionData = {
id: "test collection",
url: "test url",
title: "title",
books: [],
lanes: [],
navigationLinks: [],
facetGroups: [{
label: "group",
facets: []
}]
};
wrapper = enzyme_1.shallow(React.createElement(Collection_1.default, { collection: collectionData }));
});
it("shows facet groups", function () {
var facetGroups = wrapper.find(FacetGroup_1.default);
var facetGroupDatas = facetGroups.map(function (group) { return group.props().facetGroup; });
chai_1.expect(facetGroups.length).to.equal(1);
chai_1.expect(facetGroupDatas).to.deep.equal(collectionData.facetGroups);
});
it("shows skip navigation link for facet groups", function () {
var links = wrapper.find(SkipNavigationLink_1.default);
chai_1.expect(links.length).to.equal(1);
});
});
describe("collection with next page", function () {
it("fetches next page on scroll to bottom", function () {
var fetchPage = sinon_1.stub();
var collectionData = {
id: "test collection",
url: "test url",
title: "title",
books: [],
lanes: [],
navigationLinks: [],
nextPageUrl: "next"
};
var context = routing_1.mockRouterContext();
var wrapper = enzyme_1.mount(React.createElement(Collection_1.default, { collection: collectionData, fetchPage: fetchPage }), { context: context });
var main = wrapper.instance().refs["collection-main"];
main.scrollTop = 1000;
main.scrollHeight = 1;
main.clientHeight = 1;
wrapper.instance().handleScrollOrResize();
chai_1.expect(fetchPage.callCount).to.equal(1);
chai_1.expect(fetchPage.args[0][0]).to.equal("next");
});
it("fetches next page if first page doesn't fill window", function () {
var fetchPage = sinon_1.stub();
var collectionData = {
id: "test collection",
url: "test url",
title: "title",
books: [],
lanes: [],
navigationLinks: [],
nextPageUrl: "next"
};
var context = routing_1.mockRouterContext();
var wrapper = enzyme_1.mount(React.createElement(Collection_1.default, { collection: collectionData, fetchPage: fetchPage }), { context: context });
var main = wrapper.instance().refs["collection-main"];
main.scrollTop = 1000;
main.scrollHeight = 1;
main.clientHeight = 1;
wrapper.mount();
chai_1.expect(fetchPage.callCount).to.equal(1);
chai_1.expect(fetchPage.args[0][0]).to.equal("next");
});
it("fetches next page if newly loaded page doesn't fill window", function () {
var fetchPage = sinon_1.stub();
var collectionData = {
id: "test collection",
url: "test url",
title: "title",
books: [],
lanes: [],
navigationLinks: [],
nextPageUrl: "next"
};
var context = routing_1.mockRouterContext();
var wrapper = enzyme_1.mount(React.createElement(Collection_1.default, { collection: collectionData, fetchPage: fetchPage }), { context: context });
var main = wrapper.instance().refs["collection-main"];
main.scrollTop = 1;
main.scrollHeight = 100;
main.clientHeight = 1000;
wrapper.mount();
chai_1.expect(fetchPage.callCount).to.equal(1);
chai_1.expect(fetchPage.args[0][0]).to.equal("next");
wrapper.setProps({ isFetching: false });
// body's scroll attributes haven't changed
chai_1.expect(fetchPage.callCount).to.equal(2);
chai_1.expect(fetchPage.args[1][0]).to.equal("next");
});
it("shows loading indicator for next page", function () {
var collectionData = {
id: "test collection",
url: "test url",
title: "title",
books: [],
lanes: [],
navigationLinks: [],
};
var wrapper = enzyme_1.shallow(React.createElement(Collection_1.default, { collection: collectionData, isFetchingPage: true }));
var loadings = wrapper.find(".loading-next-page");
chai_1.expect(loadings.length).to.equal(1);
});
it("contains next page button", function () {
var fetchPage = sinon_1.stub();
var collectionData = Object.assign({}, collectionData_1.ungroupedCollectionData, {
nextPageUrl: "next page url"
});
var wrapper = enzyme_1.shallow(React.createElement(Collection_1.default, { collection: collectionData, isFetchingPage: false, fetchPage: fetchPage }));
var link = wrapper.find(".next-page-link");
chai_1.expect(link.text()).to.equal("Load more books");
});
});
describe("collection that scrolls", function () {
var collectionData = {
id: "test collection",
url: "test url",
title: "title",
books: [],
lanes: [],
navigationLinks: []
};
var wrapper;
var context;
var main;
beforeEach(function () {
context = routing_1.mockRouterContext();
wrapper = enzyme_1.mount(React.createElement(Collection_1.default, { collection: collectionData, isFetching: true }), { context: context });
main = wrapper.instance().refs["collection-main"];
main.scrollTop = 1000;
main.scrollHeight = 1;
main.clientHeight = 1;
});
it("scrolls to top when new collection fetched successfully", function () {
wrapper.setProps({ isFetching: false });
chai_1.expect(main.scrollTop).to.equal(0);
});
it("does not scroll when there's an error", function () {
var error = {
status: 500,
response: "error",
url: "url"
};
wrapper = enzyme_1.mount(React.createElement(Collection_1.default, { collection: collectionData, isFetching: false, error: error }), { context: context });
chai_1.expect(main.scrollTop).to.equal(1000);
});
});
});
;