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

Commit

Permalink
test: Refactored editor page tests
Browse files Browse the repository at this point in the history
  • Loading branch information
wbreza committed Apr 19, 2019
1 parent 466902f commit d1cd728
Show file tree
Hide file tree
Showing 3 changed files with 44 additions and 33 deletions.
42 changes: 27 additions & 15 deletions src/react/components/pages/editorPage/editorPage.test.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -30,6 +30,7 @@ import SplitPane from "react-split-pane";
import EditorSideBar from "./editorSideBar";
import Alert from "../../common/alert/alert";
import registerMixins from "../../../../registerMixins";
import { TagInput } from "../../common/tagInput/tagInput";

function createComponent(store, props: IEditorPageProps): ReactWrapper<IEditorPageProps, IEditorPageState, EditorPage> {
return mount(
Expand Down Expand Up @@ -162,7 +163,7 @@ describe("Editor Page Component", () => {
});
});

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

await MockFactory.flushUi();
wrapper.update();

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

const wrapper = createComponent(store, MockFactory.editorPageProps());
expect(wrapper.props().project.tags).toEqual(project.tags);
expect(wrapper.find(TagInput).props().tags).toEqual(project.tags);
});

it("create a new tag from text box", () => {
it("create a new tag updates project tags", async () => {
const project = MockFactory.createTestProject();
const store = createReduxStore({
...MockFactory.initialState(),
currentProject: project,
});

const wrapper = createComponent(store, MockFactory.editorPageProps());
expect(wrapper.props().project.tags).toEqual(project.tags);
await waitForSelectedAsset(wrapper);

const newTagName = "My new tag";
wrapper.find("div.tag-input-toolbar-item.plus").simulate("click");
wrapper.find(".tag-input-box").simulate("keydown", { key: "Enter", target: { value: newTagName } });
const newTag = MockFactory.createTestTag("NewTag");
const updatedTags = [...project.tags, newTag];
wrapper.find(TagInput).props().onChange(updatedTags);

await MockFactory.flushUi();
wrapper.update();

const projectTags = wrapper.props().project.tags;
const editorPage = wrapper.find(EditorPage).childAt(0) as ReactWrapper<IEditorPageProps>;
const projectTags = editorPage.props().project.tags;

expect(projectTags).toHaveLength(project.tags.length + 1);
expect(projectTags[projectTags.length - 1].name).toEqual(newTagName);
expect(projectTags).toHaveLength(updatedTags.length);
expect(projectTags[projectTags.length - 1].name).toEqual(newTag.name);
});

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

expect(wrapper.props().project.tags).toEqual(project.tags);
wrapper.find(".tag-content").last().simulate("click");
wrapper.find("i.tag-input-toolbar-icon.fas.fa-trash").simulate("click");
wrapper.find("button.btn.btn-danger").simulate("click");
const tagToDelete = project.tags[project.tags.length - 1];
wrapper.find(TagInput).props().onTagDeleted(tagToDelete.name);

// Accept the modal delete warning
wrapper.update();
wrapper.find(".modal-footer button").first().simulate("click");

await MockFactory.flushUi();
wrapper.update();

const editorPage = wrapper.find(EditorPage).childAt(0) as ReactWrapper<IEditorPageProps>;
const projectTags = editorPage.props().project.tags;

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

Expand Down
8 changes: 5 additions & 3 deletions src/react/components/pages/editorPage/editorPage.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -139,15 +139,17 @@ export default class EditorPage extends React.Component<IEditorPageProps, IEdito
// Navigating directly to the page via URL (ie, http://vott/projects/a1b2c3dEf/edit) sets the default state
// before props has been set, this updates the project and additional settings to be valid once props are
// retrieved.
if (this.props.project !== prevProps.project) {
this.updateRootAssets();

if (this.props.project && !prevProps.project) {
this.setState({
additionalSettings: {
videoSettings: (this.props.project) ? this.props.project.videoSettings : null,
},
});
}

if (this.props.project && prevProps.project && this.props.project.tags !== prevProps.project.tags) {
this.updateRootAssets();
}
}

public render() {
Expand Down
27 changes: 12 additions & 15 deletions src/services/assetService.test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -356,9 +356,6 @@ describe("Asset Service", () => {
const assetMetadata = MockFactory.createTestAssetMetadata(asset, [region]);
AssetService.prototype.getAssetMetadata = jest.fn((asset: IAsset) => Promise.resolve(assetMetadata));

const saveMetadata = jest.fn();
AssetService.prototype.save = saveMetadata;

const expectedAssetMetadata: IAssetMetadata = {
...MockFactory.createTestAssetMetadata(
asset,
Expand All @@ -373,8 +370,10 @@ describe("Asset Service", () => {

const project = populateProjectAssets();
const assetService = new AssetService(project);
await assetService.deleteTag(tag1);
expect(saveMetadata).toBeCalledWith(expectedAssetMetadata);
const assetUpdates = await assetService.deleteTag(tag1);

expect(assetUpdates).toHaveLength(1);
expect(assetUpdates[0]).toEqual(expectedAssetMetadata);
});

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

const saveMetadata = jest.fn();
AssetService.prototype.save = saveMetadata;

const expectedAssetMetadata: IAssetMetadata = MockFactory.createTestAssetMetadata(asset, []);
const project = populateProjectAssets();
const assetService = new AssetService(project);
await assetService.deleteTag(tag1);
expect(saveMetadata).toBeCalledWith(expectedAssetMetadata);
const assetUpdates = await assetService.deleteTag(tag1);

expect(assetUpdates).toHaveLength(1);
expect(assetUpdates[0]).toEqual(expectedAssetMetadata);
});

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

const saveMetadata = jest.fn();
AssetService.prototype.save = saveMetadata;

const expectedAssetMetadata: IAssetMetadata = {
...MockFactory.createTestAssetMetadata(
asset,
Expand All @@ -425,8 +420,10 @@ describe("Asset Service", () => {

const project = populateProjectAssets();
const assetService = new AssetService(project);
await assetService.renameTag(tag1, newTag);
expect(saveMetadata).toBeCalledWith(expectedAssetMetadata);
const assetUpdates = await assetService.renameTag(tag1, newTag);

expect(assetUpdates).toHaveLength(1);
expect(assetUpdates[0]).toEqual(expectedAssetMetadata);
});
});
});

0 comments on commit d1cd728

Please sign in to comment.