ljmotta commented on code in PR #2239: URL: https://github.com/apache/incubator-kie-tools/pull/2239#discussion_r1567136514
########## packages/dmn-editor/tests/e2e/__fixtures__/propertiesPanel/decisionPropertiesPanel.ts: ########## @@ -0,0 +1,140 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one + * or more contributor license agreements. See the NOTICE file + * distributed with this work for additional information + * regarding copyright ownership. The ASF licenses this file + * to you under the Apache License, Version 2.0 (the + * "License"); you may not use this file except in compliance + * with the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, + * software distributed under the License is distributed on an + * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY + * KIND, either express or implied. See the License for the + * specific language governing permissions and limitations + * under the License. + */ + +import { Page } from "@playwright/test"; +import { ShapeProperties } from "./parts/shapeProperties"; +import { PropertiesPanelBase } from "./propertiesPanelBase"; +import { Diagram } from "../diagram"; +import { FontProperties } from "./parts/fontProperties"; +import { DocumentationProperties } from "./parts/documentationProperties"; +import { DescriptionProperties } from "./parts/descriptionProperties"; +import { DataTypeProperties } from "./parts/dataTypeProperties"; +import { DataType } from "../jsonModel"; +import { NameProperties } from "./parts/nameProperties"; + +export class DecisionPropertiesPanel extends PropertiesPanelBase { + private nameProperties: NameProperties; + private dataTypeProperties: DataTypeProperties; + private descriptionProperties: DescriptionProperties; + private documentationProperties: DocumentationProperties; + private fontProperties: FontProperties; + private shapeProperties: ShapeProperties; + + constructor(public diagram: Diagram, public page: Page) { + super(diagram, page); + this.nameProperties = new NameProperties(this.panel(), page); + this.dataTypeProperties = new DataTypeProperties(this.panel(), page); + this.descriptionProperties = new DescriptionProperties(this.panel(), diagram); + this.documentationProperties = new DocumentationProperties(this.panel(), page); + this.fontProperties = new FontProperties(this.panel(), diagram); + this.shapeProperties = new ShapeProperties(this.panel()); + } + + public async setName(args: { newName: string }) { + await this.nameProperties.setName({ ...args }); + } + + public async getName() { + return await this.nameProperties.getName(); + } + + public async setDataType(args: { newDataType: DataType }) { + await this.dataTypeProperties.setDataType({ ...args }); + } + + public async setDescription(args: { newDescription: string }) { + await this.descriptionProperties.setDescription({ ...args }); + } + + public async getDescription() { + return await this.descriptionProperties.getDescription(); + } + + public async addDocumentationLink(args: { linkText: string; linkHref: string }) { + await this.documentationProperties.addDocumentationLink({ ...args }); + } + + public async getDocumentationLinks() { + return await this.documentationProperties.getDocumentationLinks(); + } + + public async setQuestion(args: { newQuestion: string }) { + await this.panel().getByPlaceholder("Enter a question...").fill(args.newQuestion); + // commit changes by click to the diagram + await this.diagram.resetFocus(); + } + + public async getQuestion() { + return await this.panel().getByPlaceholder("Enter a question...").inputValue(); + } + + public async setAllowedAnswers(args: { newAllowedAnswers: string }) { + await this.panel().getByPlaceholder("Enter allowed answers...").fill(args.newAllowedAnswers); + // commit changes by click to the diagram + await this.diagram.resetFocus(); Review Comment: For the `Add Edge - *` tests we explicity put this on the test with a `annotation`, so we don't "hide" this bug inside the fixture. We should do the same here. ########## packages/dmn-editor/src/diagram/nodes/Nodes.tsx: ########## @@ -1312,6 +1321,7 @@ export function NodeResizerHandle(props: NodeResizeHandleProps) { return ( <RF.NodeResizeControl style={resizerControlStyle} minWidth={minSize["@_width"]} minHeight={minSize["@_height"]}> <div + data-testid={`${props.nodeName}-resize-handle`} Review Comment: Looking at it now, I guess we could create more specific `data-testids` as our codebase can increase considerably. We could use `kie-tools--dmn-editor--*`, WDYT? ########## packages/dmn-editor/tests/e2e/drdArtifacts/changeGroupProperties.spec.ts: ########## @@ -0,0 +1,114 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one + * or more contributor license agreements. See the NOTICE file + * distributed with this work for additional information + * regarding copyright ownership. The ASF licenses this file + * to you under the Apache License, Version 2.0 (the + * "License"); you may not use this file except in compliance + * with the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, + * software distributed under the License is distributed on an + * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY + * KIND, either express or implied. See the License for the + * specific language governing permissions and limitations + * under the License. + */ + +import { test, expect } from "../__fixtures__/base"; +import { DefaultNodeName, NodePosition, NodeType } from "../__fixtures__/nodes"; + +test.beforeEach(async ({ editor }) => { + await editor.open(); +}); + +test.describe("Change Properties - Group", () => { + test.beforeEach(async ({ palette, nodes, groupPropertiesPanel }) => { + await palette.dragNewNode({ type: NodeType.GROUP, targetPosition: { x: 100, y: 100 } }); + await nodes.select({ name: DefaultNodeName.GROUP, position: NodePosition.TOP }); + await groupPropertiesPanel.open(); + }); + + test("should change the Group node name", async ({ nodes, groupPropertiesPanel }) => { + await nodes.select({ name: DefaultNodeName.GROUP, position: NodePosition.TOP }); + await groupPropertiesPanel.setName({ newName: "Renamed Group" }); + + await nodes.select({ name: "Renamed Group", position: NodePosition.TOP }); + await expect(nodes.get({ name: "Renamed Group" })).toBeVisible(); + expect(await groupPropertiesPanel.getName()).toBe("Renamed Group"); + }); + + test("should change the Group node description", async ({ nodes, groupPropertiesPanel }) => { + await nodes.select({ name: DefaultNodeName.GROUP, position: NodePosition.TOP }); + await groupPropertiesPanel.setDescription({ + newDescription: "New Group Description", + }); + + await nodes.select({ name: DefaultNodeName.GROUP, position: NodePosition.TOP }); + expect(await groupPropertiesPanel.getDescription()).toBe("New Group Description"); + }); + + test("should change the Group node font", async ({ diagram, nodes, groupPropertiesPanel }) => { + await nodes.select({ name: DefaultNodeName.GROUP, position: NodePosition.TOP }); + await groupPropertiesPanel.setFont({ + fontSize: "40", + bold: true, + italic: true, + underline: true, + striketrough: true, + color: "#f12200", + fontFamily: "Verdana", + }); + + await expect(diagram.get()).toHaveScreenshot("change-group-font.png"); + }); + + test("should reset the Group node font", async ({ nodes, groupPropertiesPanel }) => { + test.skip(true, "https://github.com/apache/incubator-kie-issues/issues/1076";); + await nodes.select({ name: DefaultNodeName.GROUP, position: NodePosition.TOP }); + await groupPropertiesPanel.setFont({ + fontSize: "40", + bold: true, + italic: true, + underline: true, + striketrough: true, + color: "#f12200", + fontFamily: "Verdana", + }); + await nodes.select({ name: DefaultNodeName.GROUP, position: NodePosition.TOP }); + await groupPropertiesPanel.resetFont(); + + await expect(nodes.get({ name: DefaultNodeName.GROUP })).toHaveScreenshot("reset-group-font.png"); + }); + + test("should change the Group node shape - fill color", async ({ nodes, groupPropertiesPanel }) => { + await nodes.select({ name: DefaultNodeName.GROUP, position: NodePosition.TOP }); + await groupPropertiesPanel.setFillColor({ color: "#f12200" }); + + // It's necessary to pick the parent element ".." to have access to the SVG. + await expect(nodes.get({ name: DefaultNodeName.GROUP }).locator("..").locator("rect").nth(0)).toHaveAttribute( Review Comment: Could we put this inside a fixture method? ########## packages/dmn-editor/tests/e2e/drdArtifacts/changeGroupProperties.spec.ts: ########## @@ -0,0 +1,114 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one + * or more contributor license agreements. See the NOTICE file + * distributed with this work for additional information + * regarding copyright ownership. The ASF licenses this file + * to you under the Apache License, Version 2.0 (the + * "License"); you may not use this file except in compliance + * with the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, + * software distributed under the License is distributed on an + * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY + * KIND, either express or implied. See the License for the + * specific language governing permissions and limitations + * under the License. + */ + +import { test, expect } from "../__fixtures__/base"; +import { DefaultNodeName, NodePosition, NodeType } from "../__fixtures__/nodes"; + +test.beforeEach(async ({ editor }) => { + await editor.open(); +}); + +test.describe("Change Properties - Group", () => { + test.beforeEach(async ({ palette, nodes, groupPropertiesPanel }) => { + await palette.dragNewNode({ type: NodeType.GROUP, targetPosition: { x: 100, y: 100 } }); + await nodes.select({ name: DefaultNodeName.GROUP, position: NodePosition.TOP }); + await groupPropertiesPanel.open(); + }); + + test("should change the Group node name", async ({ nodes, groupPropertiesPanel }) => { + await nodes.select({ name: DefaultNodeName.GROUP, position: NodePosition.TOP }); + await groupPropertiesPanel.setName({ newName: "Renamed Group" }); + + await nodes.select({ name: "Renamed Group", position: NodePosition.TOP }); + await expect(nodes.get({ name: "Renamed Group" })).toBeVisible(); + expect(await groupPropertiesPanel.getName()).toBe("Renamed Group"); + }); + + test("should change the Group node description", async ({ nodes, groupPropertiesPanel }) => { + await nodes.select({ name: DefaultNodeName.GROUP, position: NodePosition.TOP }); + await groupPropertiesPanel.setDescription({ + newDescription: "New Group Description", + }); + + await nodes.select({ name: DefaultNodeName.GROUP, position: NodePosition.TOP }); + expect(await groupPropertiesPanel.getDescription()).toBe("New Group Description"); + }); + + test("should change the Group node font", async ({ diagram, nodes, groupPropertiesPanel }) => { + await nodes.select({ name: DefaultNodeName.GROUP, position: NodePosition.TOP }); + await groupPropertiesPanel.setFont({ + fontSize: "40", + bold: true, + italic: true, + underline: true, + striketrough: true, + color: "#f12200", + fontFamily: "Verdana", + }); + + await expect(diagram.get()).toHaveScreenshot("change-group-font.png"); + }); + + test("should reset the Group node font", async ({ nodes, groupPropertiesPanel }) => { + test.skip(true, "https://github.com/apache/incubator-kie-issues/issues/1076";); Review Comment: Please add an `annotation` so after the issue is fixed we can keep track of what this particular test ensure -- This is an automated message from the Apache Git Service. To respond to the message, please log on to GitHub and use the URL above to go to the specific comment. To unsubscribe, e-mail: [email protected] For queries about this service, please contact Infrastructure at: [email protected] --------------------------------------------------------------------- To unsubscribe, e-mail: [email protected] For additional commands, e-mail: [email protected]
