Skip to content

Commit

Permalink
Update menu item starter brick names (#8653)
Browse files Browse the repository at this point in the history
  • Loading branch information
@twschiller
twschiller authored Jun 20, 2024
1 parent 592e3b8 commit a785f4a
Show file tree
Hide file tree
Showing 12 changed files with 152 additions and 147 deletions.
2 changes: 1 addition & 1 deletion src/analysis/analysisVisitors/selectorAnalysis.test.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@ import {
menuItemFormStateFactory,
triggerFormStateFactory,
} from "@/testUtils/factories/pageEditorFactories";
import type { AttachMode } from "@/starterBricks/menuItem/types";
import type { AttachMode } from "@/starterBricks/menuItem/menuItemTypes";
import { HighlightEffect } from "@/bricks/effects/highlight";
import brickRegistry from "@/bricks/registry";
import { JQueryReader } from "@/bricks/transformers/jquery/JQueryReader";
Expand Down
2 changes: 1 addition & 1 deletion src/components/BrickIcon.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,7 @@ import {
faWindowMaximize,
} from "@fortawesome/free-solid-svg-icons";
import { TriggerStarterBrickABC } from "@/starterBricks/trigger/triggerStarterBrick";
import { MenuItemStarterBrickABC } from "@/starterBricks/menuItem/menuItemExtension";
import { MenuItemStarterBrickABC } from "@/starterBricks/menuItem/menuItemStarterBrick";
import { ContextMenuStarterBrickABC } from "@/starterBricks/contextMenu/contextMenu";
import { PanelStarterBrickABC } from "@/starterBricks/panel/panelExtension";
import { SidebarStarterBrickABC } from "@/starterBricks/sidebar/sidebarExtension";
Expand Down
2 changes: 1 addition & 1 deletion src/contentScript/pageEditor/types.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@ import {
import {
type MenuItemDefinition,
type MenuItemStarterBrickConfig,
} from "@/starterBricks/menuItem/types";
} from "@/starterBricks/menuItem/menuItemTypes";
import { type ElementInfo } from "@/utils/inference/selectorTypes";
import { type ModComponentBase } from "@/types/modComponentTypes";
import { type UUID } from "@/types/stringTypes";
Expand Down
2 changes: 1 addition & 1 deletion src/pageEditor/panes/save/saveHelpers.test.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,7 @@ import {
import { produce } from "immer";
import { makeInternalId } from "@/registry/internal";
import { cloneDeep, range, uniq } from "lodash";
import { type MenuItemDefinition } from "@/starterBricks/menuItem/types";
import { type MenuItemDefinition } from "@/starterBricks/menuItem/menuItemTypes";
import extensionsSlice from "@/store/extensionsSlice";
import {
type StarterBrickDefinitionLike,
Expand Down
2 changes: 1 addition & 1 deletion src/pageEditor/starterBricks/formStateTypes.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@ import {
import {
type MenuItemStarterBrickConfig,
type MenuPosition,
} from "@/starterBricks/menuItem/types";
} from "@/starterBricks/menuItem/menuItemTypes";
import { type PanelConfig } from "@/starterBricks/panel/types";
import {
type QuickBarConfig,
Expand Down
4 changes: 2 additions & 2 deletions src/pageEditor/starterBricks/menuItem.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,7 @@ import {
cleanIsAvailable,
} from "@/pageEditor/starterBricks/base";
import { omitEditorMetadata } from "./pipelineMapping";
import { MenuItemStarterBrickABC } from "@/starterBricks/menuItem/menuItemExtension";
import { MenuItemStarterBrickABC } from "@/starterBricks/menuItem/menuItemStarterBrick";
import { type StarterBrickDefinitionLike } from "@/starterBricks/types";
import { getDomain } from "@/permissions/patterns";
import { faMousePointer } from "@fortawesome/free-solid-svg-icons";
Expand All @@ -47,7 +47,7 @@ import { type ActionFormState } from "./formStateTypes";
import {
type MenuItemDefinition,
type MenuItemStarterBrickConfig,
} from "@/starterBricks/menuItem/types";
} from "@/starterBricks/menuItem/menuItemTypes";
import { assertNotNullish } from "@/utils/nullishUtils";

function fromNativeElement(
Expand Down
2 changes: 1 addition & 1 deletion src/starterBricks/factory.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@
*/

import { fromJS as deserializePanel } from "@/starterBricks/panel/panelExtension";
import { fromJS as deserializeMenuItem } from "@/starterBricks/menuItem/menuItemExtension";
import { fromJS as deserializeMenuItem } from "@/starterBricks/menuItem/menuItemStarterBrick";
import { fromJS as deserializeTrigger } from "@/starterBricks/trigger/triggerStarterBrick";
import { fromJS as deserializeContextMenu } from "@/starterBricks/contextMenu/contextMenu";
import { fromJS as deserializeSidebar } from "@/starterBricks/sidebar/sidebarExtension";
Expand Down
118 changes: 59 additions & 59 deletions ...Bricks/menuItem/menuItemExtension.test.ts → ...cks/menuItem/menuItemStarterBrick.test.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@
* along with this program. If not, see <http://www.gnu.org/licenses/>.
*/

import { fromJS } from "@/starterBricks/menuItem/menuItemExtension";
import { fromJS } from "@/starterBricks/menuItem/menuItemStarterBrick";
import { validateRegistryId } from "@/types/helpers";
import { type Metadata } from "@/types/registryTypes";
import { define } from "cooky-cutter";
Expand All @@ -37,7 +37,7 @@ import { getPlatform } from "@/platform/platformContext";
import {
type MenuItemDefinition,
type MenuItemStarterBrickConfig,
} from "@/starterBricks/menuItem/types";
} from "@/starterBricks/menuItem/menuItemTypes";

jest.mock("@/runtime/reducePipeline");

Expand Down Expand Up @@ -103,80 +103,80 @@ beforeEach(() => {
rootReader.ref = null;
});

describe("menuItemExtension", () => {
describe("menuItemStarterBrick", () => {
it.each([["append"], [undefined]])(
"can add menu item with position: %s",
async (position) => {
document.body.innerHTML = getDocument("<div>foo</div>").body.innerHTML;

const extensionPoint = fromJS(
const starterBrick = fromJS(
getPlatform(),
starterBrickFactory({
position,
})(),
);

const modComponent = modComponentFactory({
extensionPointId: extensionPoint.id,
extensionPointId: starterBrick.id,
});

extensionPoint.registerModComponent(modComponent);
starterBrick.registerModComponent(modComponent);

await extensionPoint.install();
await extensionPoint.runModComponents({ reason: RunReason.MANUAL });
await starterBrick.install();
await starterBrick.runModComponents({ reason: RunReason.MANUAL });

expect(document.querySelectorAll("button")).toHaveLength(1);
expect(document.body.innerHTML).toBe(
`<div data-pb-extension-point="${extensionPoint.id}">foo<button data-pb-uuid="${modComponent.id}">Hello World</button></div>`,
`<div data-pb-extension-point="${starterBrick.id}">foo<button data-pb-uuid="${modComponent.id}">Hello World</button></div>`,
);

extensionPoint.uninstall();
starterBrick.uninstall();
},
);

it("can prepend menu item", async () => {
document.body.innerHTML = getDocument("<div>foo</div>").body.innerHTML;
const extensionPoint = fromJS(
const starterBrick = fromJS(
getPlatform(),
starterBrickFactory({
position: "prepend",
})(),
);

const modComponent = modComponentFactory({
extensionPointId: extensionPoint.id,
extensionPointId: starterBrick.id,
});

extensionPoint.registerModComponent(modComponent);
starterBrick.registerModComponent(modComponent);

await extensionPoint.install();
await extensionPoint.runModComponents({ reason: RunReason.MANUAL });
await starterBrick.install();
await starterBrick.runModComponents({ reason: RunReason.MANUAL });

expect(document.querySelectorAll("button")).toHaveLength(1);
expect(document.body.innerHTML).toBe(
`<div data-pb-extension-point="${extensionPoint.id}"><button data-pb-uuid="${modComponent.id}">Hello World</button>foo</div>`,
`<div data-pb-extension-point="${starterBrick.id}"><button data-pb-uuid="${modComponent.id}">Hello World</button>foo</div>`,
);

extensionPoint.uninstall();
starterBrick.uninstall();
});

it("can use targetMode: eventTarget", async () => {
document.body.innerHTML = getDocument("<div></div>").body.innerHTML;
const extensionPoint = fromJS(
const starterBrick = fromJS(
getPlatform(),
starterBrickFactory({
targetMode: "eventTarget",
})(),
);

extensionPoint.registerModComponent(
starterBrick.registerModComponent(
modComponentFactory({
extensionPointId: extensionPoint.id,
extensionPointId: starterBrick.id,
}),
);

await extensionPoint.install();
await extensionPoint.runModComponents({ reason: RunReason.MANUAL });
await starterBrick.install();
await starterBrick.runModComponents({ reason: RunReason.MANUAL });

expect(document.querySelectorAll("button")).toHaveLength(1);

Expand All @@ -196,29 +196,29 @@ describe("menuItemExtension", () => {
expect.toBeObject(),
);

extensionPoint.uninstall();
starterBrick.uninstall();
});

it("can user reader selector", async () => {
document.body.innerHTML = getDocument(
'<div id="outer"><div id="toolbar"></div></div>',
).body.innerHTML;
const extensionPoint = fromJS(
const starterBrick = fromJS(
getPlatform(),
starterBrickFactory({
readerSelector: "div",
containerSelector: "#toolbar",
})(),
);

extensionPoint.registerModComponent(
starterBrick.registerModComponent(
modComponentFactory({
extensionPointId: extensionPoint.id,
extensionPointId: starterBrick.id,
}),
);

await extensionPoint.install();
await extensionPoint.runModComponents({ reason: RunReason.MANUAL });
await starterBrick.install();
await starterBrick.runModComponents({ reason: RunReason.MANUAL });

expect(document.querySelectorAll("button")).toHaveLength(1);

Expand All @@ -241,28 +241,28 @@ describe("menuItemExtension", () => {
expect.toBeObject(),
);

extensionPoint.uninstall();
starterBrick.uninstall();
});

it.each([[undefined], ["document"]])(
"can use default targetMode: %s",
async (targetMode) => {
document.body.innerHTML = getDocument("<div></div>").body.innerHTML;
const extensionPoint = fromJS(
const starterBrick = fromJS(
getPlatform(),
starterBrickFactory({
targetMode,
})(),
);

extensionPoint.registerModComponent(
starterBrick.registerModComponent(
modComponentFactory({
extensionPointId: extensionPoint.id,
extensionPointId: starterBrick.id,
}),
);

await extensionPoint.install();
await extensionPoint.runModComponents({ reason: RunReason.MANUAL });
await starterBrick.install();
await starterBrick.runModComponents({ reason: RunReason.MANUAL });

expect(document.querySelectorAll("button")).toHaveLength(1);

Expand All @@ -283,7 +283,7 @@ describe("menuItemExtension", () => {
expect.toBeObject(),
);

extensionPoint.uninstall();
starterBrick.uninstall();
},
);

Expand Down Expand Up @@ -315,56 +315,56 @@ describe("menuItemExtension", () => {
document.body.innerHTML = getDocument(
'<div id="root"><div id="menu"></div></div>',
).body.innerHTML;
const extensionPoint = fromJS(
const starterBrick = fromJS(
getPlatform(),
starterBrickFactory({
containerSelector: ".newClass #menu",
})(),
);

extensionPoint.registerModComponent(
starterBrick.registerModComponent(
modComponentFactory({
extensionPointId: extensionPoint.id,
extensionPointId: starterBrick.id,
}),
);

const installPromise = extensionPoint.install();
const installPromise = starterBrick.install();

expect(document.querySelectorAll("button")).toHaveLength(0);

document.querySelector("#root")!.classList.add("newClass");

await installPromise;

await extensionPoint.runModComponents({ reason: RunReason.MANUAL });
await starterBrick.runModComponents({ reason: RunReason.MANUAL });

await tick();

console.debug(document.body.innerHTML);

expect(document.querySelectorAll("button")).toHaveLength(1);

extensionPoint.uninstall();
starterBrick.uninstall();
});

it("watch attach mode attaches new menu items", async () => {
document.body.innerHTML = getDocument(
"<div><div class='menu'></div></div>",
).body.innerHTML;
const starterBrick = starterBrickFactory()();
starterBrick.definition.containerSelector = ".menu";
starterBrick.definition.attachMode = "watch";
const starterBrickDefinition = starterBrickFactory()();
starterBrickDefinition.definition.containerSelector = ".menu";
starterBrickDefinition.definition.attachMode = "watch";

const extensionPoint = fromJS(getPlatform(), starterBrick);
const starterBrick = fromJS(getPlatform(), starterBrickDefinition);

extensionPoint.registerModComponent(
starterBrick.registerModComponent(
modComponentFactory({
extensionPointId: extensionPoint.id,
extensionPointId: starterBrick.id,
}),
);

await extensionPoint.install();
await extensionPoint.runModComponents({ reason: RunReason.MANUAL });
await starterBrick.install();
await starterBrick.runModComponents({ reason: RunReason.MANUAL });
expect(document.querySelectorAll("button")).toHaveLength(1);

$("div:first").append("<div class='menu'></div>");
Expand All @@ -374,34 +374,34 @@ describe("menuItemExtension", () => {
await tick();
expect(document.querySelectorAll("button")).toHaveLength(2);

extensionPoint.uninstall();
starterBrick.uninstall();
});

it("once does not attach for new items", async () => {
// Test the quirky behavior of "once" mode when there are multiple elements on the page and the original menu
// is removed from the page
document.body.innerHTML = getDocument("<div></div>").body.innerHTML;
const starterBrick = starterBrickFactory()();
starterBrick.definition.containerSelector = ".menu";
starterBrick.definition.attachMode = "once";
const starterBrickDefinition = starterBrickFactory()();
starterBrickDefinition.definition.containerSelector = ".menu";
starterBrickDefinition.definition.attachMode = "once";

const extensionPoint = fromJS(getPlatform(), starterBrick);
const starterBrick = fromJS(getPlatform(), starterBrickDefinition);

extensionPoint.registerModComponent(
starterBrick.registerModComponent(
modComponentFactory({
extensionPointId: extensionPoint.id,
extensionPointId: starterBrick.id,
}),
);

const installPromise = extensionPoint.install();
const installPromise = starterBrick.install();

expect(document.querySelectorAll("button")).toHaveLength(0);

$("div:first").append("<div class='menu'></div>");
await tick();
await tick();
await installPromise;
await extensionPoint.runModComponents({ reason: RunReason.MANUAL });
await starterBrick.runModComponents({ reason: RunReason.MANUAL });
expect(document.querySelectorAll("button")).toHaveLength(1);

// 2 ticks were necessary in the watch test
Expand All @@ -418,6 +418,6 @@ describe("menuItemExtension", () => {
await tick();
expect(document.querySelectorAll("button")).toHaveLength(1);

extensionPoint.uninstall();
starterBrick.uninstall();
});
});
Loading

0 comments on commit a785f4a

Please sign in to comment.