// Copyright (C) The Arvados Authors. All rights reserved.
//
// SPDX-License-Identifier: AGPL-3.0
import React from "react";
// import { mount, configure } from "enzyme";
import { SearchInput, DEFAULT_SEARCH_DEBOUNCE } from "./search-input";
// import Adapter from 'enzyme-adapter-react-16';
// configure({ adapter: new Adapter() });
describe("", () => {
let WrappedComponent;
let onSearch
beforeEach(() => {
cy.clock();
onSearch = cy.spy().as('onSearch');
// Wrap the component to test it with props update
WrappedComponent = ({ selfClearProp = '', textProp }) => {
const [text, setText] = React.useState(textProp);
const [selfClear, setSelfClear] = React.useState(selfClearProp);
window.updateProps = (newClear, newText) => {
setText(newText);
setSelfClear(newClear);
};
return ;
};
});
describe("on submit", () => {
it("calls onSearch with initial value passed via props", () => {
cy.mount();
cy.get('form').submit();
cy.get('@onSearch').should('have.been.calledWith', 'initial value');
});
it("calls onSearch with current value", () => {
cy.mount();
cy.get('input').type('current value');
cy.get('form').submit();
cy.get('@onSearch').should('have.been.calledWith', 'current value');
});
it("calls onSearch with new value passed via props", () => {
cy.mount();
cy.get('input').type('current value');
//simulate change of props
cy.window().then((win) => {
win.updateProps('', 'new value');
});
cy.get('form').submit();
cy.get('@onSearch').should('have.been.calledWith', 'new value');
});
it("cancels timeout set on input value change", () => {
cy.mount();
cy.get('input').type('current value');
cy.get('form').submit();
cy.get('@onSearch').should('have.been.calledOnce');
cy.tick(1000)
cy.get('@onSearch').should('have.been.calledOnce');
cy.get('@onSearch').should('have.been.calledWith', 'current value');
});
});
describe("on input value change", () => {
it("calls onSearch after default timeout", () => {
cy.mount();
cy.get('input').type('current value');
cy.get('@onSearch').should('not.have.been.called');
cy.tick(DEFAULT_SEARCH_DEBOUNCE);
cy.get('@onSearch').should('have.been.calledWith', 'current value');
});
it("calls onSearch after the time specified in props has passed", () => {
cy.mount();
cy.get('input').type('current value');
cy.tick(1000);
cy.get('@onSearch').should('not.have.been.called');
cy.tick(1000);
cy.get('@onSearch').should('have.been.calledWith', 'current value');
});
it("calls onSearch only once after no change happened during the specified time", () => {
cy.mount();
cy.get('input').type('current value');
cy.tick(500);
cy.get('input').type('current value');
cy.tick(1000);
cy.get('@onSearch').should('have.been.calledOnce');
});
it("calls onSearch again after the specified time has passed since previous call", () => {
cy.mount();
cy.get('input').type('current value');
cy.tick(500);
cy.get('input').clear();
cy.get('input').type('intermediate value');
cy.tick(1000);
cy.get('@onSearch').should('have.been.calledWith', 'intermediate value');
cy.get('input').clear();
cy.get('input').type('latest value');
cy.tick(1000);
cy.get('@onSearch').should('have.been.calledWith', 'latest value');
cy.get('@onSearch').should('have.been.calledTwice');
});
});
describe("on input target change", () => {
it("clears the input value on selfClearProp change", () => {
cy.mount();
// component should clear value upon creation
cy.tick(1000);
cy.get('@onSearch').should('have.been.calledWith', '');
cy.get('@onSearch').should('have.been.calledOnce');
// component should not clear on same selfClearProp
cy.window().then((win) => {
win.updateProps('', 'abc');
});
cy.tick(1000);
cy.get('@onSearch').should('have.been.called');
// component should clear on selfClearProp change
cy.window().then((win) => {
win.updateProps('', '111');
});
// cy.get('@onSearch').should('have.been.calledOnce');
cy.tick(1000);
cy.get('@onSearch').should('have.been.calledWith', '');
cy.get('@onSearch').should('have.been.calledTwice');
});
});
});