Skip to content
This repository was archived by the owner on Dec 7, 2021. It is now read-only.

Commit d1cd728

Browse files
committed
test: Refactored editor page tests
1 parent 466902f commit d1cd728

File tree

3 files changed

+44
-33
lines changed

3 files changed

+44
-33
lines changed

src/react/components/pages/editorPage/editorPage.test.tsx

Lines changed: 27 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -30,6 +30,7 @@ import SplitPane from "react-split-pane";
3030
import EditorSideBar from "./editorSideBar";
3131
import Alert from "../../common/alert/alert";
3232
import registerMixins from "../../../../registerMixins";
33+
import { TagInput } from "../../common/tagInput/tagInput";
3334

3435
function createComponent(store, props: IEditorPageProps): ReactWrapper<IEditorPageProps, IEditorPageState, EditorPage> {
3536
return mount(
@@ -162,7 +163,7 @@ describe("Editor Page Component", () => {
162163
});
163164
});
164165

165-
it("Raises onAssetSelected handler when an asset is selected from the sidebar", async () => {
166+
it("Default asset is loaded and saved during initial page rendering", async () => {
166167
// create test project and asset
167168
const testProject = MockFactory.createTestProject("TestProject");
168169
const defaultAsset = testAssets[0];
@@ -180,6 +181,7 @@ describe("Editor Page Component", () => {
180181
const editorPage = wrapper.find(EditorPage).childAt(0) as ReactWrapper<IEditorPageProps, IEditorPageState>;
181182

182183
await MockFactory.flushUi();
184+
wrapper.update();
183185

184186
const expectedAsset = editorPage.state().assets[0];
185187
const partialProject = {
@@ -669,26 +671,31 @@ describe("Editor Page Component", () => {
669671
});
670672

671673
const wrapper = createComponent(store, MockFactory.editorPageProps());
672-
expect(wrapper.props().project.tags).toEqual(project.tags);
674+
expect(wrapper.find(TagInput).props().tags).toEqual(project.tags);
673675
});
674676

675-
it("create a new tag from text box", () => {
677+
it("create a new tag updates project tags", async () => {
676678
const project = MockFactory.createTestProject();
677679
const store = createReduxStore({
678680
...MockFactory.initialState(),
679681
currentProject: project,
680682
});
683+
681684
const wrapper = createComponent(store, MockFactory.editorPageProps());
682-
expect(wrapper.props().project.tags).toEqual(project.tags);
685+
await waitForSelectedAsset(wrapper);
683686

684-
const newTagName = "My new tag";
685-
wrapper.find("div.tag-input-toolbar-item.plus").simulate("click");
686-
wrapper.find(".tag-input-box").simulate("keydown", { key: "Enter", target: { value: newTagName } });
687+
const newTag = MockFactory.createTestTag("NewTag");
688+
const updatedTags = [...project.tags, newTag];
689+
wrapper.find(TagInput).props().onChange(updatedTags);
690+
691+
await MockFactory.flushUi();
692+
wrapper.update();
687693

688-
const projectTags = wrapper.props().project.tags;
694+
const editorPage = wrapper.find(EditorPage).childAt(0) as ReactWrapper<IEditorPageProps>;
695+
const projectTags = editorPage.props().project.tags;
689696

690-
expect(projectTags).toHaveLength(project.tags.length + 1);
691-
expect(projectTags[projectTags.length - 1].name).toEqual(newTagName);
697+
expect(projectTags).toHaveLength(updatedTags.length);
698+
expect(projectTags[projectTags.length - 1].name).toEqual(newTag.name);
692699
});
693700

694701
it("Remove a tag", async () => {
@@ -701,14 +708,19 @@ describe("Editor Page Component", () => {
701708
const wrapper = createComponent(store, MockFactory.editorPageProps());
702709
await waitForSelectedAsset(wrapper);
703710

704-
expect(wrapper.props().project.tags).toEqual(project.tags);
705-
wrapper.find(".tag-content").last().simulate("click");
706-
wrapper.find("i.tag-input-toolbar-icon.fas.fa-trash").simulate("click");
707-
wrapper.find("button.btn.btn-danger").simulate("click");
711+
const tagToDelete = project.tags[project.tags.length - 1];
712+
wrapper.find(TagInput).props().onTagDeleted(tagToDelete.name);
713+
714+
// Accept the modal delete warning
715+
wrapper.update();
716+
wrapper.find(".modal-footer button").first().simulate("click");
708717

709718
await MockFactory.flushUi();
719+
wrapper.update();
720+
721+
const editorPage = wrapper.find(EditorPage).childAt(0) as ReactWrapper<IEditorPageProps>;
722+
const projectTags = editorPage.props().project.tags;
710723

711-
const projectTags = wrapper.props().project.tags;
712724
expect(projectTags).toHaveLength(project.tags.length - 1);
713725
});
714726

src/react/components/pages/editorPage/editorPage.tsx

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -139,15 +139,17 @@ export default class EditorPage extends React.Component<IEditorPageProps, IEdito
139139
// Navigating directly to the page via URL (ie, http://vott/projects/a1b2c3dEf/edit) sets the default state
140140
// before props has been set, this updates the project and additional settings to be valid once props are
141141
// retrieved.
142-
if (this.props.project !== prevProps.project) {
143-
this.updateRootAssets();
144-
142+
if (this.props.project && !prevProps.project) {
145143
this.setState({
146144
additionalSettings: {
147145
videoSettings: (this.props.project) ? this.props.project.videoSettings : null,
148146
},
149147
});
150148
}
149+
150+
if (this.props.project && prevProps.project && this.props.project.tags !== prevProps.project.tags) {
151+
this.updateRootAssets();
152+
}
151153
}
152154

153155
public render() {

src/services/assetService.test.ts

Lines changed: 12 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -356,9 +356,6 @@ describe("Asset Service", () => {
356356
const assetMetadata = MockFactory.createTestAssetMetadata(asset, [region]);
357357
AssetService.prototype.getAssetMetadata = jest.fn((asset: IAsset) => Promise.resolve(assetMetadata));
358358

359-
const saveMetadata = jest.fn();
360-
AssetService.prototype.save = saveMetadata;
361-
362359
const expectedAssetMetadata: IAssetMetadata = {
363360
...MockFactory.createTestAssetMetadata(
364361
asset,
@@ -373,8 +370,10 @@ describe("Asset Service", () => {
373370

374371
const project = populateProjectAssets();
375372
const assetService = new AssetService(project);
376-
await assetService.deleteTag(tag1);
377-
expect(saveMetadata).toBeCalledWith(expectedAssetMetadata);
373+
const assetUpdates = await assetService.deleteTag(tag1);
374+
375+
expect(assetUpdates).toHaveLength(1);
376+
expect(assetUpdates[0]).toEqual(expectedAssetMetadata);
378377
});
379378

380379
it("Deletes empty regions after deleting only tag from region", async () => {
@@ -387,14 +386,13 @@ describe("Asset Service", () => {
387386
const assetMetadata = MockFactory.createTestAssetMetadata(asset, [region]);
388387
AssetService.prototype.getAssetMetadata = jest.fn((asset: IAsset) => Promise.resolve(assetMetadata));
389388

390-
const saveMetadata = jest.fn();
391-
AssetService.prototype.save = saveMetadata;
392-
393389
const expectedAssetMetadata: IAssetMetadata = MockFactory.createTestAssetMetadata(asset, []);
394390
const project = populateProjectAssets();
395391
const assetService = new AssetService(project);
396-
await assetService.deleteTag(tag1);
397-
expect(saveMetadata).toBeCalledWith(expectedAssetMetadata);
392+
const assetUpdates = await assetService.deleteTag(tag1);
393+
394+
expect(assetUpdates).toHaveLength(1);
395+
expect(assetUpdates[0]).toEqual(expectedAssetMetadata);
398396
});
399397

400398
it("Updates renamed tag within all assets", async () => {
@@ -408,9 +406,6 @@ describe("Asset Service", () => {
408406
const assetMetadata = MockFactory.createTestAssetMetadata(asset, [region]);
409407
AssetService.prototype.getAssetMetadata = jest.fn((asset: IAsset) => Promise.resolve(assetMetadata));
410408

411-
const saveMetadata = jest.fn();
412-
AssetService.prototype.save = saveMetadata;
413-
414409
const expectedAssetMetadata: IAssetMetadata = {
415410
...MockFactory.createTestAssetMetadata(
416411
asset,
@@ -425,8 +420,10 @@ describe("Asset Service", () => {
425420

426421
const project = populateProjectAssets();
427422
const assetService = new AssetService(project);
428-
await assetService.renameTag(tag1, newTag);
429-
expect(saveMetadata).toBeCalledWith(expectedAssetMetadata);
423+
const assetUpdates = await assetService.renameTag(tag1, newTag);
424+
425+
expect(assetUpdates).toHaveLength(1);
426+
expect(assetUpdates[0]).toEqual(expectedAssetMetadata);
430427
});
431428
});
432429
});

0 commit comments

Comments
 (0)