opds-web-client/lib/components/__tests__/Collection-test.js

OPDS web client

"use strict";
jest.autoMockOff();
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}));
            expect(wrapper.text()).toBe("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 anchor", function () {
            var link = wrapper.find(".mainAnchor");
            expect(link.props().name).toBe("main");
        });
        it("shows lanes", function () {
            var lanes = wrapper.find(Lanes_1.Lanes);
            expect(lanes.props().url).toBe(collectionData.url);
            expect(lanes.props().lanes).toEqual(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("shows #main anchor", function () {
            var link = wrapper.find(".mainAnchor");
            expect(link.props().name).toBe("main");
        });
        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; })));
            expect(books.length).toBe(collectionData.books.length);
            expect(bookDatas).toEqual(collectionData.books);
            expect(uniqueCollectionUrls).toEqual([collectionData.url]);
        });
    });
    describe("collection with facetGroups", function () {
        var collectionData, wrapper;
        beforeEach(function () {
            collectionData = {
                id: "test collection",
                url: "test url",
                title: "title",
                books: [],
                lanes: [],
                links: [],
                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; });
            expect(facetGroups.length).toEqual(1);
            expect(facetGroupDatas).toEqual(collectionData.facetGroups);
        });
        it("shows skip navigation link for facet groups", function () {
            var links = wrapper.find(SkipNavigationLink_1.default);
            expect(links.length).toBe(1);
        });
    });
    describe("collection with next page", function () {
        it("fetches next page on scroll to bottom", function () {
            var fetchPage = jest.genMockFunction();
            var collectionData = {
                id: "test collection",
                url: "test url",
                title: "title",
                books: [],
                lanes: [],
                links: [],
                nextPageUrl: "next"
            };
            var context = routing_1.mockRouterContext();
            var wrapper = enzyme_1.mount(React.createElement(Collection_1.default, {collection: collectionData, fetchPage: fetchPage}), { context: context });
            document.body.scrollTop = 1000;
            document.body.scrollHeight = 1;
            window.dispatchEvent(new UIEvent("scroll", { detail: 0 }));
            expect(fetchPage.mock.calls.length).toEqual(1);
            expect(fetchPage.mock.calls[0][0]).toEqual("next");
            // firefox puts scrollTop in document.documentElement instead of document.body
            document.body.scrollTop = 0;
            document.documentElement.scrollTop = 1000;
            document.body.scrollHeight = 1;
            window.dispatchEvent(new UIEvent("scroll", { detail: 0 }));
            expect(fetchPage.mock.calls.length).toEqual(2);
            expect(fetchPage.mock.calls[1][0]).toEqual("next");
        });
        it("fetches next page if first page doesn't fill window", function () {
            document.body.scrollTop = 1000;
            document.body.scrollHeight = 1;
            var fetchPage = jest.genMockFunction();
            var collectionData = {
                id: "test collection",
                url: "test url",
                title: "title",
                books: [],
                lanes: [],
                links: [],
                nextPageUrl: "next"
            };
            var context = routing_1.mockRouterContext();
            var wrapper = enzyme_1.mount(React.createElement(Collection_1.default, {collection: collectionData, fetchPage: fetchPage}), { context: context });
            expect(fetchPage.mock.calls.length).toEqual(1);
            expect(fetchPage.mock.calls[0][0]).toEqual("next");
        });
        it("shows loading indicator for next page", function () {
            var collectionData = {
                id: "test collection",
                url: "test url",
                title: "title",
                books: [],
                lanes: [],
                links: [],
            };
            var wrapper = enzyme_1.shallow(React.createElement(Collection_1.default, {collection: collectionData, isFetchingPage: true}));
            var loadings = wrapper.find(".loadingNextPage");
            expect(loadings.length).toBe(1);
        });
        it("contains next page button", function () {
            var fetchPage = jest.genMockFunction();
            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(".nextPageLink");
            expect(link.text()).toBe("Load more books");
        });
    });
    describe("collection that scrolls", function () {
        var collectionData = {
            id: "test collection",
            url: "test url",
            title: "title",
            books: [],
            lanes: [],
            links: []
        };
        var wrapper;
        var context;
        beforeEach(function () {
            context = routing_1.mockRouterContext();
            wrapper = enzyme_1.mount(React.createElement(Collection_1.default, {collection: collectionData, isFetching: true}), { context: context });
            document.body.scrollTop = 1000;
        });
        it("scrolls to top when new collection fetched successfully", function () {
            wrapper.setProps({ isFetching: false });
            expect(document.body.scrollTop).toEqual(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 });
            expect(document.body.scrollTop).toEqual(1000);
        });
    });
});