Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Upgrade react-day-picker, fix caption months support, regen lockfile #3461

Merged
merged 6 commits into from
Apr 10, 2019
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion packages/core/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -59,7 +59,7 @@
"@blueprintjs/karma-build-scripts": "^0.10.0",
"@blueprintjs/node-build-scripts": "^0.9.0",
"@blueprintjs/test-commons": "^0.9.0",
"enzyme": "^3.3.0",
"enzyme": "^3.9.0",
"karma": "^3.1.4",
"mocha": "^5.2.0",
"npm-run-all": "^4.1.2",
Expand Down
219 changes: 123 additions & 96 deletions packages/core/test/overflow-list/overflowListTests.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@
*/

import { assert } from "chai";
import { mount } from "enzyme";
import { mount, ReactWrapper } from "enzyme";
import * as React from "react";

import { spy } from "sinon";
Expand All @@ -37,52 +37,70 @@ describe("<OverflowList>", function(this) {
// these tests rely on DOM measurement which can be flaky, so we allow some retries
this.retries(3);

const testsContainerElement = document.createElement("div");
document.documentElement.appendChild(testsContainerElement);
const onOverflowSpy = spy();
let testsContainerElement: HTMLElement;
let wrapper: IOverflowListWrapper;

beforeEach(() => {
testsContainerElement = document.createElement("div");
document.body.appendChild(testsContainerElement);
});

afterEach(() => {
if (wrapper !== undefined) {
// clean up wrapper to remove Portal element from DOM
wrapper.unmount();
wrapper.detach();
wrapper = undefined;
}
testsContainerElement.remove();
onOverflowSpy.resetHistory();
});

it("adds className to itself", () => {
assert.isTrue(
overflowList(30, { className: "winner" })
.wrapper.find(".winner")
.find(".winner")
.exists(),
);
});

it("uses custom tagName", () => {
assert.lengthOf(overflowList(undefined, { tagName: "section" }).wrapper.find("section"), 1);
assert.lengthOf(overflowList(undefined, { tagName: "section" }).find("section"), 1);
});

it("overflows correctly on initial mount", () => {
overflowList().assertVisibleItemSplit(4);
});

it("shows more after growing", async () => {
// :O it sure reads synchronously
return (await (await overflowList(15)
.assertVisibleItemSplit(1)
.setWidth(35)
.waitForResize())
.assertVisibleItemSplit(3)
.setWidth(200)
.waitForResize()).assertVisibleItems(...IDS);
overflowList(15);
wrapper.assertVisibleItemSplit(1);

await wrapper.setWidth(35).waitForResize();
wrapper.assertVisibleItemSplit(3);

await wrapper.setWidth(200).waitForResize();
wrapper.assertVisibleItems(...IDS);
});

it("shows fewer after shrinking", async () => {
(await overflowList(45)
.assertVisibleItemSplit(4)
.setWidth(15)
.waitForResize()).assertVisibleItemSplit(1);
overflowList(45).assertVisibleItemSplit(4);
await wrapper.setWidth(15).waitForResize();
wrapper.assertVisibleItemSplit(1);
});

it("shows at least minVisibleItems", () => {
overflowList(15, { minVisibleItems: 5 }).assertVisibleItemSplit(5);
});

it("shows more after increasing minVisibleItems", () => {
overflowList(35, { minVisibleItems: 2 })
.assertVisibleItemSplit(3)
.setProps({ minVisibleItems: 5 })
.assertVisibleItemSplit(5);
overflowList(35, { minVisibleItems: 2 });
wrapper.assertVisibleItemSplit(3);

wrapper.setProps({ minVisibleItems: 5 });
wrapper.update();
wrapper.assertVisibleItemSplit(5);
});

it("does not render the overflow if all items are displayed", () => {
Expand All @@ -103,18 +121,18 @@ describe("<OverflowList>", function(this) {

describe("onOverflow", () => {
it("invoked on initial render if has overflow", async () => {
const list = await overflowList(22).waitForResize();
list.assertLastOnOverflowArgs([0, 1, 2, 3]);
await overflowList(22).waitForResize();
wrapper.assertLastOnOverflowArgs([0, 1, 2, 3]);
});

it("not invoked on initial render if all visible", async () => {
const list = await overflowList(200).waitForResize();
assert.isTrue(list.onOverflow.notCalled, "not called");
await overflowList(200).waitForResize();
assert.isTrue(onOverflowSpy.notCalled, "not called");
});

it("invoked once per resize", async () => {
// initial render shows all items (empty overflow)
const list = await overflowList(200).waitForResize();
await overflowList(200).waitForResize();
// assert that at given width, onOverflow receives given IDs
const tests = [
{ width: 15, overflowIds: [0, 1, 2, 3, 4] },
Expand All @@ -123,32 +141,32 @@ describe("<OverflowList>", function(this) {
{ width: 35, overflowIds: [0, 1, 2] },
];
for (const { overflowIds, width } of tests) {
(await list.setWidth(width).waitForResize()).assertLastOnOverflowArgs(overflowIds);
(await wrapper.setWidth(width).waitForResize()).assertLastOnOverflowArgs(overflowIds);
}
// ensure onOverflow is not called additional times.
assert.equal(list.onOverflow.callCount, tests.length, "should invoke once per resize");
assert.equal(onOverflowSpy.callCount, tests.length, "should invoke once per resize");
});

it("not invoked if resize doesn't change overflow", async () => {
// show a few items
const list = await overflowList(22).waitForResize();
await overflowList(22).waitForResize();
// small adjustments don't change overflow state, but it is recomputed internally.
// assert that the callback was not invoked because the appearance hasn't changed.
list.onOverflow.resetHistory();
await list.setWidth(25).waitForResize();
await list.setWidth(28).waitForResize();
await list.setWidth(29).waitForResize();
await list.setWidth(26).waitForResize();
await list.setWidth(22).waitForResize();
assert.isTrue(list.onOverflow.notCalled, "should not invoke");
onOverflowSpy.resetHistory();
await wrapper.setWidth(25).waitForResize();
await wrapper.setWidth(28).waitForResize();
await wrapper.setWidth(29).waitForResize();
await wrapper.setWidth(26).waitForResize();
await wrapper.setWidth(22).waitForResize();
assert.isTrue(onOverflowSpy.notCalled, "should not invoke");
});

it("invoked when items change", async () => {
const list = await overflowList(22).waitForResize();
await overflowList(22).waitForResize();
// copy of same items so overflow state should end up the same.
await list.setProps({ items: [...ITEMS] }).waitForResize();
assert.isTrue(list.onOverflow.calledTwice, "should be called twice");
const [one, two] = list.onOverflow.args;
await wrapper.setProps({ items: [...ITEMS] }).waitForResize();
assert.isTrue(onOverflowSpy.calledTwice, "should be called twice");
const [one, two] = onOverflowSpy.args;
assert.sameDeepMembers(one, two, "items should be the same");
});
});
Expand All @@ -161,72 +179,81 @@ describe("<OverflowList>", function(this) {
return <TestItem key={index} {...item} />;
}

interface IOverflowListWrapper extends ReactWrapper<IOverflowListProps<ITestItem>, IOverflowListState<ITestItem>> {
assertHasOverflow(exists: boolean): IOverflowListWrapper;
assertLastOnOverflowArgs(ids: number[]): IOverflowListWrapper;
assertVisibleItemSplit(visibleCount: number): IOverflowListWrapper;
assertOverflowItems(...ids: number[]): IOverflowListWrapper;
assertVisibleItems(...ids: number[]): IOverflowListWrapper;
// setProps<K extends keyof OverflowProps>(newProps: Pick<OverflowProps, K>): IOverflowListWrapper;
setWidth(width: number): IOverflowListWrapper;
waitForResize(): Promise<IOverflowListWrapper>;
}

function overflowList(initialWidth = 45, props: Partial<OverflowProps> = {}) {
const onOverflow = spy();
const wrapper = mount<OverflowProps, IOverflowListState<ITestItem>>(
wrapper = mount<OverflowProps, IOverflowListState<ITestItem>>(
<OverflowList
items={ITEMS}
onOverflow={onOverflow}
onOverflow={onOverflowSpy}
overflowRenderer={renderOverflow}
visibleItemRenderer={renderVisibleItem}
style={{ width: initialWidth }}
{...props}
/>,
// measuring elements only works in the DOM, so this element actually needs to be attached
{ attachTo: testsContainerElement },
).update();

const harness = {
/** Assert existence of overflow element. */
assertHasOverflow(exists: boolean) {
assert.equal(wrapper.find(TestOverflow).exists(), exists, "has overflow");
return harness;
},
/** Asserts that the last call to `onOverflow` received the given item IDs. */
assertLastOnOverflowArgs(ids: number[]) {
assert.sameMembers(onOverflow.lastCall.args[0].map((i: ITestItem) => i.id), ids);
},
/**
* Invokes both assertions below with the expected visible and
* overflow IDs assuming `collapseFrom="start"`.
*/
assertVisibleItemSplit(visibleCount: number) {
return harness
.assertOverflowItems(...IDS.slice(0, -visibleCount))
.assertVisibleItems(...IDS.slice(-visibleCount));
},
/** Assert ordered IDs of overflow items. */
assertOverflowItems(...ids: number[]) {
const overflowItems = wrapper.find(TestOverflow).prop("items");
assert.sameMembers(overflowItems.map(it => it.id), ids, "overflow items");
return harness;
},
/** Assert ordered IDs of visible items. */
assertVisibleItems(...ids: number[]) {
const visibleItems = wrapper.find(TestItem).map(div => div.prop("id"));
assert.sameMembers(visibleItems, ids, "visible items");
return harness;
},
setProps<K extends keyof OverflowProps>(newProps: Pick<OverflowProps, K>) {
wrapper.setProps(newProps).update();
return harness;
},
setWidth(width: number) {
return harness.setProps({ style: { width } });
},
/** Promise that resolves after DOM has a chance to settle. */
waitForResize() {
return new Promise<typeof harness>(resolve =>
setTimeout(() => {
wrapper.update();
resolve(harness);
}, 30),
);
},

onOverflow,
wrapper,
) as IOverflowListWrapper;
wrapper = wrapper.update();

wrapper.assertHasOverflow = (exists: boolean) => {
assert.equal(wrapper.find(TestOverflow).exists(), exists, "has overflow");
return wrapper;
};

/** Asserts that the last call to `onOverflow` received the given item IDs. */
wrapper.assertLastOnOverflowArgs = (ids: number[]) => {
assert.sameMembers(onOverflowSpy.lastCall.args[0].map((i: ITestItem) => i.id), ids);
return wrapper;
};
return harness;

/**
* Invokes both assertions below with the expected visible and
* overflow IDs assuming `collapseFrom="start"`.
*/
wrapper.assertVisibleItemSplit = (visibleCount: number) => {
return wrapper
.assertOverflowItems(...IDS.slice(0, -visibleCount))
.assertVisibleItems(...IDS.slice(-visibleCount));
};

/** Assert ordered IDs of overflow items. */
wrapper.assertOverflowItems = (...ids: number[]) => {
const overflowItems = wrapper.find(TestOverflow).prop("items");
assert.sameMembers(overflowItems.map(it => it.id), ids, "overflow items");
return wrapper;
};

/** Assert ordered IDs of visible items. */
wrapper.assertVisibleItems = (...ids: number[]) => {
const visibleItems = wrapper.find(TestItem).map(div => div.prop("id"));
assert.sameMembers(visibleItems, ids, "visible items");
return wrapper;
};

wrapper.setWidth = (width: number) => {
return wrapper.setProps({ style: { width } });
};

/** Promise that resolves after DOM has a chance to settle. */
wrapper.waitForResize = async () => {
return new Promise<IOverflowListWrapper>(resolve =>
setTimeout(() => {
wrapper.update();
resolve(wrapper);
}, 30),
);
};

return wrapper;
}
});
6 changes: 5 additions & 1 deletion packages/core/test/popover/popoverTests.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -383,13 +383,16 @@ describe("<Popover>", () => {
.assertIsOpen();
});

it("state does not update on user interaction", () => {
it("state does not update on user (click) interaction", () => {
renderPopover({ isOpen: true })
.simulateTarget("click")
.assertIsOpen()
.setProps({ isOpen: false })
.simulateTarget("click")
.assertIsOpen(false);
});

it("state does not update on user (key) interaction", () => {
renderPopover({ canEscapeKeyClose: true, isOpen: true })
.sendEscapeKey()
.assertIsOpen();
Expand Down Expand Up @@ -738,6 +741,7 @@ describe("<Popover>", () => {
</Popover>,
{ attachTo: testsContainerElement },
) as IPopoverWrapper;

wrapper.popoverElement = (wrapper.instance() as Popover).popoverElement;
wrapper.assertFindClass = (className: string, expected = true, msg = className) => {
(expected ? assert.isTrue : assert.isFalse)(wrapper.findClass(className).exists(), msg);
Expand Down
10 changes: 6 additions & 4 deletions packages/core/test/text/textTests.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -55,12 +55,13 @@ describe("<Text>", () => {

describe("title behavior", () => {
let testsContainerElement: HTMLElement;
before(() => {

beforeEach(() => {
testsContainerElement = document.createElement("div");
document.documentElement.appendChild(testsContainerElement);
});

after(() => {
afterEach(() => {
testsContainerElement.remove();
});

Expand All @@ -72,8 +73,9 @@ describe("<Text>", () => {
});

it("does not add the title attribute when text does not overflow", () => {
const textContent = "this doesn't overflow";
const wrapper = mount(<Text ellipsize={true}>{textContent}</Text>, { attachTo: testsContainerElement });
const textContent = "no overflow";
let wrapper = mount(<Text ellipsize={true}>{textContent}</Text>, { attachTo: testsContainerElement });
wrapper = wrapper.update();
const actualTitle = wrapper.find(`.${Classes.TEXT_OVERFLOW_ELLIPSIS}`).prop("title");
assert.strictEqual(actualTitle, undefined, "title should be undefined");
});
Expand Down
4 changes: 2 additions & 2 deletions packages/datetime/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -37,14 +37,14 @@
"dependencies": {
"@blueprintjs/core": "^3.15.0",
"classnames": "^2.2",
"react-day-picker": "^7.1.10",
"react-day-picker": "^7.3.0",
"tslib": "^1.9.0"
},
"devDependencies": {
"@blueprintjs/karma-build-scripts": "^0.10.0",
"@blueprintjs/node-build-scripts": "^0.9.0",
"@blueprintjs/test-commons": "^0.9.0",
"enzyme": "^3.3.0",
"enzyme": "^3.9.0",
"karma": "^3.1.4",
"mocha": "^5.2.0",
"npm-run-all": "^4.1.2",
Expand Down
Loading