This is an automated email from the ASF dual-hosted git repository.
tiagobento pushed a commit to branch main
in repository https://gitbox.apache.org/repos/asf/incubator-kie-tools.git
The following commit(s) were added to refs/heads/main by this push:
new 716e33b40c9 kie-issues#1552: Test Scenario Editor: Update
`@kie-tools/dmn-vscode-extension` to add the new Test Scenario Editor (#2860)
716e33b40c9 is described below
commit 716e33b40c9cec160df7ef005810f0ca10dda14a
Author: Yeser Amer <[email protected]>
AuthorDate: Wed Jan 22 21:56:19 2025 +0100
kie-issues#1552: Test Scenario Editor: Update
`@kie-tools/dmn-vscode-extension` to add the new Test Scenario Editor (#2860)
---
packages/dmn-vscode-extension/README.md | 2 +-
packages/dmn-vscode-extension/package.json | 9 +-
.../src/extension/extension.ts | 6 +
.../webview/NewTestScenarioEditorEnvelopeApp.ts} | 16 +-
packages/dmn-vscode-extension/webpack.config.js | 1 +
.../src/TestScenarioEditorRoot.tsx | 6 +-
packages/scesim-editor/.storybook/preview.tsx | 6 +-
packages/scesim-editor/package.json | 6 +-
packages/scesim-editor/src/TestScenarioEditor.css | 19 +--
packages/scesim-editor/src/TestScenarioEditor.tsx | 3 +-
.../src/creation/TestScenarioCreationPanel.tsx | 2 +-
.../drawer/TestScenarioDrawerDataSelectorPanel.css | 2 -
.../drawer/TestScenarioDrawerDataSelectorPanel.tsx | 159 ++++++++++----------
.../stories/dev/DevWebApp.stories.tsx | 165 +++++++++++----------
.../stories/scesimEditorStoriesWrapper.tsx | 34 +++--
.../scesim-editor/tests-e2e/__fixtures__/editor.ts | 2 +-
.../emptyExpression/create-a-new-test-scenario.png | Bin 16204 -> 15450 bytes
.../backgroundTable/background-table-decision.png | Bin 17420 -> 17185 bytes
.../backgroundTable/background-table-rule.png | Bin 17448 -> 17267 bytes
.../emptyExpression/create-a-new-test-scenario.png | Bin 14175 -> 13603 bytes
.../backgroundTable/background-table-decision.png | Bin 21255 -> 18797 bytes
.../backgroundTable/background-table-rule.png | Bin 21255 -> 18634 bytes
.../emptyExpression/create-a-new-test-scenario.png | Bin 14048 -> 16178 bytes
.../backgroundTable/background-table-decision.png | Bin 14215 -> 15193 bytes
.../backgroundTable/background-table-rule.png | Bin 14215 -> 15193 bytes
pnpm-lock.yaml | 6 +
repo/graph.dot | 3 +-
repo/graph.json | 59 ++++----
28 files changed, 273 insertions(+), 233 deletions(-)
diff --git a/packages/dmn-vscode-extension/README.md
b/packages/dmn-vscode-extension/README.md
index 9a70986c7dd..121679e3992 100644
--- a/packages/dmn-vscode-extension/README.md
+++ b/packages/dmn-vscode-extension/README.md
@@ -22,7 +22,7 @@
Create and edit DMN and SceSim files.
-> NOTE: This extension provides two DMN Editors. The classic one will be
removed in future versions. See the details of the new DMN Editor
[here](https://github.com/apache/incubator-kie-issues/issues/439).
+> NOTE: This extension provides two sets of DMN and Test Scenario Editors. The
classic ones are currently the default choice, but you can switch to the new
Editor based on your need. The classic editors will be removed in future
versions. See the details of the new DMN Editor
[here](https://github.com/apache/incubator-kie-issues/issues/439) and the new
Test Scenario Editor
[here](https://github.com/apache/incubator-kie-issues/issues/453).
## Features
diff --git a/packages/dmn-vscode-extension/package.json
b/packages/dmn-vscode-extension/package.json
index 02f57606231..a459b55f1cb 100644
--- a/packages/dmn-vscode-extension/package.json
+++ b/packages/dmn-vscode-extension/package.json
@@ -30,7 +30,8 @@
"@kie-tools-core/patternfly-base": "workspace:*",
"@kie-tools-core/vscode-extension": "workspace:*",
"@kie-tools/dmn-editor-envelope": "workspace:*",
- "@kie-tools/kie-bc-editors": "workspace:*"
+ "@kie-tools/kie-bc-editors": "workspace:*",
+ "@kie-tools/scesim-editor-envelope": "workspace:*"
},
"devDependencies": {
"@kie-tools-core/webpack-base": "workspace:*",
@@ -106,7 +107,7 @@
},
"customEditors": [
{
- "displayName": "KIE DMN/SceSim Editors (classic)",
+ "displayName": "KIE DMN/Test Scenario Editors (classic)",
"selector": [
{
"filenamePattern": "*.{dmn,scesim}"
@@ -115,10 +116,10 @@
"viewType": "kieKogitoWebviewEditorsDmn"
},
{
- "displayName": "KIE DMN Editor",
+ "displayName": "KIE DMN/Test Scenario Editors",
"selector": [
{
- "filenamePattern": "*.dmn"
+ "filenamePattern": "*.{dmn,scesim}"
}
],
"viewType": "kieToolsDmnEditor"
diff --git a/packages/dmn-vscode-extension/src/extension/extension.ts
b/packages/dmn-vscode-extension/src/extension/extension.ts
index 3e8f4d5b4c2..f3a0c9e06b4 100644
--- a/packages/dmn-vscode-extension/src/extension/extension.ts
+++ b/packages/dmn-vscode-extension/src/extension/extension.ts
@@ -59,6 +59,12 @@ export function activate(context: vscode.ExtensionContext) {
resourcesPathPrefix: "",
envelopeContent: { type: EnvelopeContentType.PATH, path:
"dist/webview/NewDmnEditorEnvelopeApp.js" },
}),
+ new EnvelopeMapping({
+ type: "scesim",
+ filePathGlob: "**/*.scesim",
+ resourcesPathPrefix: "",
+ envelopeContent: { type: EnvelopeContentType.PATH, path:
"dist/webview/NewTestScenarioEditorEnvelopeApp.js" },
+ }),
]),
});
diff --git a/packages/scesim-editor/stories/dev/DevWebApp.css
b/packages/dmn-vscode-extension/src/webview/NewTestScenarioEditorEnvelopeApp.ts
similarity index 68%
rename from packages/scesim-editor/stories/dev/DevWebApp.css
rename to
packages/dmn-vscode-extension/src/webview/NewTestScenarioEditorEnvelopeApp.ts
index 56cf69df0c8..3492c731595 100644
--- a/packages/scesim-editor/stories/dev/DevWebApp.css
+++
b/packages/dmn-vscode-extension/src/webview/NewTestScenarioEditorEnvelopeApp.ts
@@ -17,9 +17,13 @@
* under the License.
*/
-.section-body {
- --pf-c-page__main-section--PaddingTop: 0px;
- --pf-c-page__main-section--PaddingRight: 0px;
- --pf-c-page__main-section--PaddingBottom: 0px;
- --pf-c-page__main-section--PaddingLeft: 0px;
-}
+import * as EditorEnvelope from "@kie-tools-core/editor/dist/envelope";
+import { TestScenarioEditorFactory } from
"@kie-tools/scesim-editor-envelope/dist/TestScenarioEditorFactory";
+
+declare const acquireVsCodeApi: any;
+
+EditorEnvelope.init({
+ container: document.getElementById("envelope-app")!,
+ bus: acquireVsCodeApi(),
+ editorFactory: new TestScenarioEditorFactory(),
+});
diff --git a/packages/dmn-vscode-extension/webpack.config.js
b/packages/dmn-vscode-extension/webpack.config.js
index 3086d7b2830..54d686f171f 100644
--- a/packages/dmn-vscode-extension/webpack.config.js
+++ b/packages/dmn-vscode-extension/webpack.config.js
@@ -69,6 +69,7 @@ module.exports = async (webpackEnv) => [
"webview/DmnEditorEnvelopeApp": "./src/webview/DmnEditorEnvelopeApp.ts",
"webview/SceSimEditorEnvelopeApp":
"./src/webview/SceSimEditorEnvelopeApp.ts",
"webview/NewDmnEditorEnvelopeApp":
"./src/webview/NewDmnEditorEnvelopeApp.ts",
+ "webview/NewTestScenarioEditorEnvelopeApp":
"./src/webview/NewTestScenarioEditorEnvelopeApp.ts",
},
module: {
rules: [...patternflyBase.webpackModuleRules],
diff --git a/packages/scesim-editor-envelope/src/TestScenarioEditorRoot.tsx
b/packages/scesim-editor-envelope/src/TestScenarioEditorRoot.tsx
index d38148a2239..b1a2dd21052 100644
--- a/packages/scesim-editor-envelope/src/TestScenarioEditorRoot.tsx
+++ b/packages/scesim-editor-envelope/src/TestScenarioEditorRoot.tsx
@@ -114,7 +114,7 @@ export class TestScenarioEditorRoot extends
React.Component<TestScenarioEditorRo
openFilenormalizedPosixPathRelativeToTheWorkspaceRoot: string,
content: string
): Promise<void> {
- const marshaller = this.getMarshaller(content || EMPTY_ONE_EIGHT);
+ const marshaller = this.getMarshaller(content);
// Save stack
let savedStackPointer: SceSimModel[] = [];
@@ -411,7 +411,7 @@ function ExternalModelsManager({
useEffect(() => {
let canceled = false;
- if (!thisScesimNormalizedPosixPathRelativeToTheWorkspaceRoot ||
!targetNamespace) {
+ if (!thisScesimNormalizedPosixPathRelativeToTheWorkspaceRoot) {
return;
}
@@ -455,7 +455,7 @@ function ExternalModelsManager({
const ext =
__path.extname(resource.normalizedPosixPathRelativeToTheWorkspaceRoot);
if (ext === ".dmn") {
const namespace =
domParser.getDomDocument(content).documentElement.getAttribute("namespace");
- if (namespace === targetNamespace) {
+ if (targetNamespace && namespace === targetNamespace) {
// Check for multiplicity of namespaces on DMN models
if (externalModelsIndex[namespace]) {
console.warn(
diff --git a/packages/scesim-editor/.storybook/preview.tsx
b/packages/scesim-editor/.storybook/preview.tsx
index f0300e08ed8..c6bb991d6af 100644
--- a/packages/scesim-editor/.storybook/preview.tsx
+++ b/packages/scesim-editor/.storybook/preview.tsx
@@ -44,7 +44,11 @@ const preview: Preview = {
},
// It should be Story() to be possible to use "preview-api" inside stories;
(https://github.com/storybookjs/storybook/issues/22132)
- decorators: [(Story) => <div
data-testid="test-scenario-editor">{Story()}</div>],
+ decorators: [
+ (Story) => (
+ <div style={{ position: "absolute", width: "100vw", height: "100vh",
top: "0px", left: "0px" }}>{Story()}</div>
+ ),
+ ],
};
export default preview;
diff --git a/packages/scesim-editor/package.json
b/packages/scesim-editor/package.json
index 5814b86fe1f..a7067c83102 100644
--- a/packages/scesim-editor/package.json
+++ b/packages/scesim-editor/package.json
@@ -5,9 +5,10 @@
"license": "Apache-2.0",
"keywords": [],
"scripts": {
- "build:dev": "rimraf dist && tsc -p tsconfig.json",
- "build:prod": "rimraf dist && pnpm lint && tsc -p tsconfig.json && pnpm
test-e2e",
+ "build:dev": "rimraf dist && pnpm copy:css && tsc -p tsconfig.json",
+ "build:prod": "rimraf dist && pnpm copy:css && pnpm lint && tsc -p
tsconfig.json && pnpm test-e2e",
"build:storybook": "rimraf dist-storybook && NODE_ENV=development
storybook build -o dist-storybook",
+ "copy:css": "copyfiles -u 1 \"src/**/*.{sass,scss,css}\" dist/",
"lint": "run-script-if --bool \"$(build-env linters.run)\" --then
\"kie-tools--eslint ./src\"",
"powershell": "@powershell -NoProfile -ExecutionPolicy Unrestricted
-Command",
"start": "run-script-os",
@@ -59,6 +60,7 @@
"@types/react-table": "^7.0.25",
"@types/uuid": "^8.3.0",
"copy-webpack-plugin": "^11.0.0",
+ "copyfiles": "^2.4.1",
"cross-env": "^7.0.3",
"deep-object-diff": "^1.1.9",
"file-loader": "^6.2.0",
diff --git a/packages/scesim-editor/src/TestScenarioEditor.css
b/packages/scesim-editor/src/TestScenarioEditor.css
index 8856e46aa07..a0550bf326e 100644
--- a/packages/scesim-editor/src/TestScenarioEditor.css
+++ b/packages/scesim-editor/src/TestScenarioEditor.css
@@ -18,12 +18,16 @@
*/
.kie-scesim-editor--background-table-container {
- overflow-x: auto;
+ overflow: auto;
}
.kie-scesim-editor--content {
- padding-right: 50px;
- height: 100%;
+ position: absolute;
+ top: 0;
+ left: 0;
+ bottom: 0;
+ right: 0;
+ margin-right: 50px;
}
.kie-scesim-editor--content-alert {
@@ -31,7 +35,8 @@
}
.kie-scesim-editor--content-tabs {
- padding-top: 15px;
+ height: 100%;
+ padding-top: 10px;
padding-left: 15px;
}
@@ -39,10 +44,6 @@
margin-top: 50px;
}
-.kie-scesim-editor--grid-container {
- height: 100%;
-}
-
.kie-scesim-editor--scenario-table-container {
- overflow-x: auto;
+ overflow: auto;
}
diff --git a/packages/scesim-editor/src/TestScenarioEditor.tsx
b/packages/scesim-editor/src/TestScenarioEditor.tsx
index b352179c2ff..b83819e9d01 100644
--- a/packages/scesim-editor/src/TestScenarioEditor.tsx
+++ b/packages/scesim-editor/src/TestScenarioEditor.tsx
@@ -39,6 +39,7 @@ import { EmptyState, EmptyStateBody, EmptyStateIcon } from
"@patternfly/react-co
import { Icon } from "@patternfly/react-core/dist/js/components/Icon";
import { Spinner } from "@patternfly/react-core/dist/js/components/Spinner";
import { Tabs, Tab, TabTitleIcon, TabTitleText } from
"@patternfly/react-core/dist/js/components/Tabs";
+
import { Title } from "@patternfly/react-core/dist/js/components/Title";
import { Tooltip } from "@patternfly/react-core/dist/js/components/Tooltip";
@@ -395,7 +396,7 @@ export const TestScenarioEditorInternal = ({
console.trace("[TestScenarioEditorInternal] File Status: " +
TestScenarioFileStatus[scesimFileStatus]);
return (
- <div ref={testScenarioEditorRootElementRef}>
+ <div ref={testScenarioEditorRootElementRef}
data-testid="kie-scesim-editor--container">
{(() => {
switch (scesimFileStatus) {
case TestScenarioFileStatus.EMPTY:
diff --git a/packages/scesim-editor/src/creation/TestScenarioCreationPanel.tsx
b/packages/scesim-editor/src/creation/TestScenarioCreationPanel.tsx
index 679b924171b..56ffdf20ff0 100644
--- a/packages/scesim-editor/src/creation/TestScenarioCreationPanel.tsx
+++ b/packages/scesim-editor/src/creation/TestScenarioCreationPanel.tsx
@@ -68,7 +68,7 @@ function TestScenarioCreationPanel() {
const settings = state.scesim.model.ScenarioSimulationModel.settings;
settings.dmnFilePath = assetType === "DMN" ? { __$$text:
"./MockedDMNName.dmn" } : undefined;
settings.dmnName = assetType === "DMN" ? { __$$text:
"MockedDMNName.dmn" } : undefined;
- settings.dmnNamespace = assetType === "DMN" ? { __$$text:
"https:\\kiegroup" } : undefined;
+ settings.dmnNamespace = assetType === "DMN" ? { __$$text:
"https:\\kie" } : undefined;
settings.dmoSession = assetType === "RULE" && kieSessionRule ? {
__$$text: kieSessionRule } : undefined;
settings.ruleFlowGroup = assetType === "RULE" && ruleFlowGroup ? {
__$$text: ruleFlowGroup } : undefined;
settings.skipFromBuild = { __$$text: isTestSkipped };
diff --git
a/packages/scesim-editor/src/drawer/TestScenarioDrawerDataSelectorPanel.css
b/packages/scesim-editor/src/drawer/TestScenarioDrawerDataSelectorPanel.css
index 83809bc7224..245949e285a 100644
--- a/packages/scesim-editor/src/drawer/TestScenarioDrawerDataSelectorPanel.css
+++ b/packages/scesim-editor/src/drawer/TestScenarioDrawerDataSelectorPanel.css
@@ -31,12 +31,10 @@
}
.kie-scesim-editor-drawer-data-objects--selector {
- height: 500px;
overflow: scroll;
}
.kie-scesim-editor-drawer-data-objects--selector-disabled {
- height: 500px;
overflow: scroll;
opacity: 0.25;
pointer-events: none;
diff --git
a/packages/scesim-editor/src/drawer/TestScenarioDrawerDataSelectorPanel.tsx
b/packages/scesim-editor/src/drawer/TestScenarioDrawerDataSelectorPanel.tsx
index f6aebaa087b..38ebc772c7e 100644
--- a/packages/scesim-editor/src/drawer/TestScenarioDrawerDataSelectorPanel.tsx
+++ b/packages/scesim-editor/src/drawer/TestScenarioDrawerDataSelectorPanel.tsx
@@ -27,6 +27,7 @@ import { Divider } from
"@patternfly/react-core/dist/js/components/Divider/";
import { EmptyState, EmptyStateBody, EmptyStateIcon } from
"@patternfly/react-core/dist/js/components/EmptyState";
import { HelpIcon } from "@patternfly/react-icons/dist/esm/icons/help-icon";
import { Icon } from "@patternfly/react-core/dist/js/components/Icon";
+import { Stack, StackItem } from
"@patternfly/react-core/dist/js/layouts/Stack";
import { Text } from "@patternfly/react-core/dist/js/components/Text";
import { Title } from "@patternfly/react-core/dist/js/components/Title";
import { Toolbar, ToolbarContent, ToolbarItem } from
"@patternfly/react-core/dist/js/components/Toolbar/";
@@ -477,87 +478,93 @@ function TestScenarioDataSelectorPanel() {
);
return (
- <>
- <Text className="kie-scesim-editor-drawer-data-objects--text">
- {testScenarioType === "DMN"
- ? i18n.drawer.dataSelector.descriptionDMN
- : i18n.drawer.dataSelector.descriptionRule}
- <Tooltip
- content={
- testScenarioType === "DMN"
- ? i18n.drawer.dataSelector.dataObjectsDescriptionDMN
- : i18n.drawer.dataSelector.dataObjectsDescriptionRule
- }
- >
- <Icon className={"kie-scesim-editor-drawer-data-objects--info-icon"}
size="sm" status="info">
- <HelpIcon />
- </Icon>
- </Tooltip>
- </Text>
+ <Stack>
+ <StackItem>
+ <Text className="kie-scesim-editor-drawer-data-objects--text">
+ {testScenarioType === "DMN"
+ ? i18n.drawer.dataSelector.descriptionDMN
+ : i18n.drawer.dataSelector.descriptionRule}
+ <Tooltip
+ content={
+ testScenarioType === "DMN"
+ ? i18n.drawer.dataSelector.dataObjectsDescriptionDMN
+ : i18n.drawer.dataSelector.dataObjectsDescriptionRule
+ }
+ >
+ <Icon
className={"kie-scesim-editor-drawer-data-objects--info-icon"} size="sm"
status="info">
+ <HelpIcon />
+ </Icon>
+ </Tooltip>
+ </Text>
+ </StackItem>
<Divider />
- <div className={"kie-scesim-editor-drawer-data-objects--selector"}>
- {treeViewEmptyStatus.enabled ? (
- <div aria-disabled={true}>
- <TreeView
- activeItems={treeViewStatus.activeItems}
- allExpanded={allExpanded || treeViewStatus.isExpanded}
- className={
- dataSelectorStatus !== TestScenarioDataSelectorState.DISABLED
- ? undefined
- : "kie-scesim-editor-drawer-data-objects--selector-disabled"
- }
- data={filteredItems}
- hasBadges
- hasSelectableNodes
- onSelect={onSelectTreeViewItem}
- toolbar={treeViewSearchToolbar}
- />
- </div>
- ) : (
- <Bullseye>
- <EmptyState>
- <EmptyStateIcon icon={treeViewEmptyStatus.icon} />
- <Title headingLevel="h4" size="lg">
- {treeViewEmptyStatus.title}
- </Title>
-
<EmptyStateBody>{treeViewEmptyStatus.description}</EmptyStateBody>
- </EmptyState>
- </Bullseye>
- )}
- </div>
+ <StackItem isFilled>
+ <div className={"kie-scesim-editor-drawer-data-objects--selector"}>
+ {treeViewEmptyStatus.enabled ? (
+ <div aria-disabled={true}>
+ <TreeView
+ activeItems={treeViewStatus.activeItems}
+ allExpanded={allExpanded || treeViewStatus.isExpanded}
+ className={
+ dataSelectorStatus !== TestScenarioDataSelectorState.DISABLED
+ ? undefined
+ :
"kie-scesim-editor-drawer-data-objects--selector-disabled"
+ }
+ data={filteredItems}
+ hasBadges
+ hasSelectableNodes
+ onSelect={onSelectTreeViewItem}
+ toolbar={treeViewSearchToolbar}
+ />
+ </div>
+ ) : (
+ <Bullseye>
+ <EmptyState>
+ <EmptyStateIcon icon={treeViewEmptyStatus.icon} />
+ <Title headingLevel="h4" size="lg">
+ {treeViewEmptyStatus.title}
+ </Title>
+
<EmptyStateBody>{treeViewEmptyStatus.description}</EmptyStateBody>
+ </EmptyState>
+ </Bullseye>
+ )}
+ </div>
+ </StackItem>
<Divider />
- <div
className={"kie-scesim-editor-drawer-data-objects--button-container"}>
- <Tooltip content={insertDataObjectButtonStatus.message}>
+ <StackItem>
+ <div
className={"kie-scesim-editor-drawer-data-objects--button-container"}>
+ <Tooltip content={insertDataObjectButtonStatus.message}>
+ <Button
+ isAriaDisabled={!insertDataObjectButtonStatus.enabled}
+ onClick={onInsertDataObjectClick}
+ variant="primary"
+ >
+ {i18n.drawer.dataSelector.insertDataObject}
+ </Button>
+ </Tooltip>
<Button
- isAriaDisabled={!insertDataObjectButtonStatus.enabled}
- onClick={onInsertDataObjectClick}
- variant="primary"
+ isDisabled={
+ treeViewStatus.activeItems.length !== 1 || dataSelectorStatus
!== TestScenarioDataSelectorState.ENABLED
+ }
+ onClick={onClearSelectionClicked}
+ variant="secondary"
>
- {i18n.drawer.dataSelector.insertDataObject}
+ {i18n.drawer.dataSelector.clearSelection}
</Button>
- </Tooltip>
- <Button
- isDisabled={
- treeViewStatus.activeItems.length !== 1 || dataSelectorStatus !==
TestScenarioDataSelectorState.ENABLED
- }
- onClick={onClearSelectionClicked}
- variant="secondary"
- >
- {i18n.drawer.dataSelector.clearSelection}
- </Button>
- <Button
- isDisabled={
- filteredItems.length < 1 ||
- treeViewStatus.isExpanded ||
- dataSelectorStatus !== TestScenarioDataSelectorState.ENABLED
- }
- onClick={onAllExpandedToggle}
- variant="link"
- >
- {allExpanded ? i18n.drawer.dataSelector.collapseAll :
i18n.drawer.dataSelector.expandAll}
- </Button>
- </div>
- </>
+ <Button
+ isDisabled={
+ filteredItems.length < 1 ||
+ treeViewStatus.isExpanded ||
+ dataSelectorStatus !== TestScenarioDataSelectorState.ENABLED
+ }
+ onClick={onAllExpandedToggle}
+ variant="link"
+ >
+ {allExpanded ? i18n.drawer.dataSelector.collapseAll :
i18n.drawer.dataSelector.expandAll}
+ </Button>
+ </div>
+ </StackItem>
+ </Stack>
);
}
diff --git a/packages/scesim-editor/stories/dev/DevWebApp.stories.tsx
b/packages/scesim-editor/stories/dev/DevWebApp.stories.tsx
index 580fe83116e..43c3a3d536d 100644
--- a/packages/scesim-editor/stories/dev/DevWebApp.stories.tsx
+++ b/packages/scesim-editor/stories/dev/DevWebApp.stories.tsx
@@ -38,7 +38,6 @@ import { emptyFileName, emptySceSim } from
"../misc/empty/Empty.stories";
import { isOldEnoughDrl, isOldEnoughDrlFileName } from
"../useCases/IsOldEnoughRule.stories";
import { trafficViolationDmn, trafficViolationDmnFileName } from
"../useCases/TrafficViolationDmn.stories";
import { availableModelsByPath } from "../examples/AvailableDMNModels";
-import "./DevWebApp.css";
function DevWebApp(props: TestScenarioEditorProps) {
const [fileName, setFileName] = useState<string |
undefined>("Untitled.scesim");
@@ -156,87 +155,89 @@ function DevWebApp(props: TestScenarioEditorProps) {
}, []);
return (
- <Page onDragOver={onDragOver} onDrop={onDrop}>
- <PageSection aria-label={"dev-app-header"} variant={"light"}
isFilled={false}>
- <Stack hasGutter>
- <StackItem>
- <Flex justifyContent={{ default: "justifyContentSpaceBetween" }}>
- <FlexItem shrink={{ default: "shrink" }}>
- <h3>Test Scenario Editor :: Dev WebApp</h3>
- </FlexItem>
- <FlexItem>
- <h5>(Drag & drop a file anywhere to open it)</h5>
- </FlexItem>
- </Flex>
- </StackItem>
- <StackItem>
- <Flex justifyContent={{ default: "justifyContentSpaceBetween" }}>
- <FlexItem shrink={{ default: "shrink" }}>
- <Button onClick={() => onSelectModel(emptySceSim,
emptyFileName)}>Empty</Button>
-
- <Button onClick={() => onSelectModel(isOldEnoughDrl,
isOldEnoughDrlFileName)}>
- Are They Old Enough?
- </Button>
-
- <Button onClick={() => onSelectModel(trafficViolationDmn,
trafficViolationDmnFileName)}>
- Traffic Violation
- </Button>
- |
- <Button
- onClick={undo}
- disabled={!isUndoEnabled}
- style={{ opacity: isUndoEnabled ? 1 : 0.5 }}
- variant="secondary"
- >
- {`Undo (${state.pointer})`}
- </Button>
-
- <Button
- onClick={redo}
- disabled={!isRedoEnabled}
- style={{ opacity: isRedoEnabled ? 1 : 0.5 }}
- variant="secondary"
- >
- {`Redo (${state.stack.length - 1 - state.pointer})`}
- </Button>
- |
- <Button onClick={reset} variant="tertiary">
- Reset
- </Button>
-
- <Button onClick={copyAsXml} variant="tertiary">
- Copy as XML
- </Button>
-
- <Button onClick={downloadAsXml} variant="tertiary">
- Download
- </Button>
- </FlexItem>
- </Flex>
- </StackItem>
- </Stack>
- <a ref={downloadRef} />
- </PageSection>
- <hr />
- <PageSection
- aria-label={"dev-app-body"}
- className={"section-body"}
- isFilled={true}
- hasOverflowScroll={true}
- variant={"light"}
- >
- {SceSimEditorWrapper({
- issueTrackerHref: props.issueTrackerHref,
- externalModelsByNamespace: externalModelsByNamespace,
- model: currentModel,
- onModelChange: onModelChange,
- onRequestExternalModelsAvailableToInclude:
onRequestExternalModelsAvailableToInclude,
- onRequestExternalModelByPath: onRequestExternalModelByPath,
- onRequestToJumpToPath: onRequestToJumpToPath,
- openFileNormalizedPosixPathRelativeToTheWorkspaceRoot: fileName,
- })}
- </PageSection>
- </Page>
+ <div style={{ width: "100vw", height: "100vh" }}>
+ <Page onDragOver={onDragOver} onDrop={onDrop}>
+ <PageSection aria-label={"dev-app-header"} variant={"light"}
isFilled={false}>
+ <Stack hasGutter>
+ <StackItem>
+ <Flex justifyContent={{ default: "justifyContentSpaceBetween" }}>
+ <FlexItem shrink={{ default: "shrink" }}>
+ <h3>Test Scenario Editor :: Dev WebApp</h3>
+ </FlexItem>
+ <FlexItem>
+ <h5>(Drag & drop a file anywhere to open it)</h5>
+ </FlexItem>
+ </Flex>
+ </StackItem>
+ <StackItem>
+ <Flex justifyContent={{ default: "justifyContentSpaceBetween" }}>
+ <FlexItem shrink={{ default: "shrink" }}>
+ <Button onClick={() => onSelectModel(emptySceSim,
emptyFileName)}>Empty</Button>
+
+ <Button onClick={() => onSelectModel(isOldEnoughDrl,
isOldEnoughDrlFileName)}>
+ Are They Old Enough?
+ </Button>
+
+ <Button onClick={() => onSelectModel(trafficViolationDmn,
trafficViolationDmnFileName)}>
+ Traffic Violation
+ </Button>
+ |
+ <Button
+ onClick={undo}
+ disabled={!isUndoEnabled}
+ style={{ opacity: isUndoEnabled ? 1 : 0.5 }}
+ variant="secondary"
+ >
+ {`Undo (${state.pointer})`}
+ </Button>
+
+ <Button
+ onClick={redo}
+ disabled={!isRedoEnabled}
+ style={{ opacity: isRedoEnabled ? 1 : 0.5 }}
+ variant="secondary"
+ >
+ {`Redo (${state.stack.length - 1 - state.pointer})`}
+ </Button>
+ |
+ <Button onClick={reset} variant="tertiary">
+ Reset
+ </Button>
+
+ <Button onClick={copyAsXml} variant="tertiary">
+ Copy as XML
+ </Button>
+
+ <Button onClick={downloadAsXml} variant="tertiary">
+ Download
+ </Button>
+ </FlexItem>
+ </Flex>
+ </StackItem>
+ </Stack>
+ <a ref={downloadRef} />
+ </PageSection>
+ <hr />
+ <PageSection
+ aria-label={"editor"}
+ isFilled={true}
+ hasOverflowScroll={true}
+ padding={{ default: "noPadding" }}
+ variant={"light"}
+ >
+ {SceSimEditorWrapper({
+ issueTrackerHref: props.issueTrackerHref,
+ externalModelsByNamespace: externalModelsByNamespace,
+ model: currentModel,
+ onModelChange: onModelChange,
+ onRequestExternalModelsAvailableToInclude:
onRequestExternalModelsAvailableToInclude,
+ onRequestExternalModelByPath: onRequestExternalModelByPath,
+ onRequestToJumpToPath: onRequestToJumpToPath,
+ openFileNormalizedPosixPathRelativeToTheWorkspaceRoot: fileName,
+ })}
+ </PageSection>
+ </Page>
+ </div>
);
}
diff --git a/packages/scesim-editor/stories/scesimEditorStoriesWrapper.tsx
b/packages/scesim-editor/stories/scesimEditorStoriesWrapper.tsx
index 802302e52ca..99e7cadaa13 100644
--- a/packages/scesim-editor/stories/scesimEditorStoriesWrapper.tsx
+++ b/packages/scesim-editor/stories/scesimEditorStoriesWrapper.tsx
@@ -65,21 +65,23 @@ export function SceSimEditorWrapper(props:
Partial<StorybookTestScenarioEditorPr
}, []);
return (
- <TestScenarioEditor
- ref={ref}
- issueTrackerHref={props?.issueTrackerHref ?? args.issueTrackerHref}
- model={model}
- onModelChange={onModelChange}
- onModelDebounceStateChanged={onModelDebounceStateChanged}
- onRequestExternalModelByPath={props?.onRequestExternalModelByPath ??
args.onRequestExternalModelByPath}
- onRequestExternalModelsAvailableToInclude={
- props?.onRequestExternalModelsAvailableToInclude ??
args.onRequestExternalModelsAvailableToInclude
- }
- openFileNormalizedPosixPathRelativeToTheWorkspaceRoot={
- props?.openFileNormalizedPosixPathRelativeToTheWorkspaceRoot ??
- args.openFileNormalizedPosixPathRelativeToTheWorkspaceRoot
- }
- onRequestToJumpToPath={props?.onRequestToJumpToPath ??
args.onRequestToJumpToPath}
- />
+ <div style={{ position: "absolute", width: "100%", height: "100%", top:
"0px", left: "0px" }}>
+ <TestScenarioEditor
+ ref={ref}
+ issueTrackerHref={props?.issueTrackerHref ?? args.issueTrackerHref}
+ model={model}
+ onModelChange={onModelChange}
+ onModelDebounceStateChanged={onModelDebounceStateChanged}
+ onRequestExternalModelByPath={props?.onRequestExternalModelByPath ??
args.onRequestExternalModelByPath}
+ onRequestExternalModelsAvailableToInclude={
+ props?.onRequestExternalModelsAvailableToInclude ??
args.onRequestExternalModelsAvailableToInclude
+ }
+ openFileNormalizedPosixPathRelativeToTheWorkspaceRoot={
+ props?.openFileNormalizedPosixPathRelativeToTheWorkspaceRoot ??
+ args.openFileNormalizedPosixPathRelativeToTheWorkspaceRoot
+ }
+ onRequestToJumpToPath={props?.onRequestToJumpToPath ??
args.onRequestToJumpToPath}
+ />
+ </div>
);
}
diff --git a/packages/scesim-editor/tests-e2e/__fixtures__/editor.ts
b/packages/scesim-editor/tests-e2e/__fixtures__/editor.ts
index 082d5692770..c4a191a2d61 100644
--- a/packages/scesim-editor/tests-e2e/__fixtures__/editor.ts
+++ b/packages/scesim-editor/tests-e2e/__fixtures__/editor.ts
@@ -61,6 +61,6 @@ export class Editor {
}
public get() {
- return this.page.getByTestId("test-scenario-editor");
+ return this.page.getByTestId("kie-scesim-editor--container");
}
}
diff --git
a/packages/scesim-editor/tests-e2e/__screenshots__/Google-Chrome/misc/emptyExpression/create-a-new-test-scenario.png
b/packages/scesim-editor/tests-e2e/__screenshots__/Google-Chrome/misc/emptyExpression/create-a-new-test-scenario.png
index 4334ab5e3a3..86e54f6d1e3 100644
Binary files
a/packages/scesim-editor/tests-e2e/__screenshots__/Google-Chrome/misc/emptyExpression/create-a-new-test-scenario.png
and
b/packages/scesim-editor/tests-e2e/__screenshots__/Google-Chrome/misc/emptyExpression/create-a-new-test-scenario.png
differ
diff --git
a/packages/scesim-editor/tests-e2e/__screenshots__/Google-Chrome/scesimEditor/backgroundTable/background-table-decision.png
b/packages/scesim-editor/tests-e2e/__screenshots__/Google-Chrome/scesimEditor/backgroundTable/background-table-decision.png
index 3231d861425..be9c280df35 100644
Binary files
a/packages/scesim-editor/tests-e2e/__screenshots__/Google-Chrome/scesimEditor/backgroundTable/background-table-decision.png
and
b/packages/scesim-editor/tests-e2e/__screenshots__/Google-Chrome/scesimEditor/backgroundTable/background-table-decision.png
differ
diff --git
a/packages/scesim-editor/tests-e2e/__screenshots__/Google-Chrome/scesimEditor/backgroundTable/background-table-rule.png
b/packages/scesim-editor/tests-e2e/__screenshots__/Google-Chrome/scesimEditor/backgroundTable/background-table-rule.png
index 2532fe345c3..edc772ed697 100644
Binary files
a/packages/scesim-editor/tests-e2e/__screenshots__/Google-Chrome/scesimEditor/backgroundTable/background-table-rule.png
and
b/packages/scesim-editor/tests-e2e/__screenshots__/Google-Chrome/scesimEditor/backgroundTable/background-table-rule.png
differ
diff --git
a/packages/scesim-editor/tests-e2e/__screenshots__/chromium/misc/emptyExpression/create-a-new-test-scenario.png
b/packages/scesim-editor/tests-e2e/__screenshots__/chromium/misc/emptyExpression/create-a-new-test-scenario.png
index 7cd45f75364..31a5bcac536 100644
Binary files
a/packages/scesim-editor/tests-e2e/__screenshots__/chromium/misc/emptyExpression/create-a-new-test-scenario.png
and
b/packages/scesim-editor/tests-e2e/__screenshots__/chromium/misc/emptyExpression/create-a-new-test-scenario.png
differ
diff --git
a/packages/scesim-editor/tests-e2e/__screenshots__/chromium/scesimEditor/backgroundTable/background-table-decision.png
b/packages/scesim-editor/tests-e2e/__screenshots__/chromium/scesimEditor/backgroundTable/background-table-decision.png
index 99afc0e3208..9d80024e0d0 100644
Binary files
a/packages/scesim-editor/tests-e2e/__screenshots__/chromium/scesimEditor/backgroundTable/background-table-decision.png
and
b/packages/scesim-editor/tests-e2e/__screenshots__/chromium/scesimEditor/backgroundTable/background-table-decision.png
differ
diff --git
a/packages/scesim-editor/tests-e2e/__screenshots__/chromium/scesimEditor/backgroundTable/background-table-rule.png
b/packages/scesim-editor/tests-e2e/__screenshots__/chromium/scesimEditor/backgroundTable/background-table-rule.png
index 99afc0e3208..808a48fcaf8 100644
Binary files
a/packages/scesim-editor/tests-e2e/__screenshots__/chromium/scesimEditor/backgroundTable/background-table-rule.png
and
b/packages/scesim-editor/tests-e2e/__screenshots__/chromium/scesimEditor/backgroundTable/background-table-rule.png
differ
diff --git
a/packages/scesim-editor/tests-e2e/__screenshots__/webkit/misc/emptyExpression/create-a-new-test-scenario.png
b/packages/scesim-editor/tests-e2e/__screenshots__/webkit/misc/emptyExpression/create-a-new-test-scenario.png
index caa7de3b78b..22b39fb94a1 100644
Binary files
a/packages/scesim-editor/tests-e2e/__screenshots__/webkit/misc/emptyExpression/create-a-new-test-scenario.png
and
b/packages/scesim-editor/tests-e2e/__screenshots__/webkit/misc/emptyExpression/create-a-new-test-scenario.png
differ
diff --git
a/packages/scesim-editor/tests-e2e/__screenshots__/webkit/scesimEditor/backgroundTable/background-table-decision.png
b/packages/scesim-editor/tests-e2e/__screenshots__/webkit/scesimEditor/backgroundTable/background-table-decision.png
index 6fe38f08b09..596027bce98 100644
Binary files
a/packages/scesim-editor/tests-e2e/__screenshots__/webkit/scesimEditor/backgroundTable/background-table-decision.png
and
b/packages/scesim-editor/tests-e2e/__screenshots__/webkit/scesimEditor/backgroundTable/background-table-decision.png
differ
diff --git
a/packages/scesim-editor/tests-e2e/__screenshots__/webkit/scesimEditor/backgroundTable/background-table-rule.png
b/packages/scesim-editor/tests-e2e/__screenshots__/webkit/scesimEditor/backgroundTable/background-table-rule.png
index 6fe38f08b09..596027bce98 100644
Binary files
a/packages/scesim-editor/tests-e2e/__screenshots__/webkit/scesimEditor/backgroundTable/background-table-rule.png
and
b/packages/scesim-editor/tests-e2e/__screenshots__/webkit/scesimEditor/backgroundTable/background-table-rule.png
differ
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index e7567068343..3fc90eabf7d 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -4848,6 +4848,9 @@ importers:
'@kie-tools/kie-bc-editors':
specifier: workspace:*
version: link:../kie-bc-editors
+ '@kie-tools/scesim-editor-envelope':
+ specifier: workspace:*
+ version: link:../scesim-editor-envelope
devDependencies:
'@kie-tools-core/webpack-base':
specifier: workspace:*
@@ -10039,6 +10042,9 @@ importers:
copy-webpack-plugin:
specifier: ^11.0.0
version: 11.0.0([email protected]([email protected]))
+ copyfiles:
+ specifier: ^2.4.1
+ version: 2.4.1
cross-env:
specifier: ^7.0.3
version: 7.0.3
diff --git a/repo/graph.dot b/repo/graph.dot
index f8a1a25983c..52dde62ecc4 100644
--- a/repo/graph.dot
+++ b/repo/graph.dot
@@ -114,6 +114,7 @@ digraph G {
"@kie-tools/dmn-runner" [ color = "blue", fontcolor = "blue", style =
"rounded" ];
"@kie-tools/extended-services-api" [ color = "blue", fontcolor = "blue",
style = "rounded" ];
"dmn-vscode-extension" [ color = "blue", fontcolor = "blue", style =
"rounded" ];
+ "@kie-tools/scesim-editor-envelope" [ color = "blue", fontcolor = "blue",
style = "rounded" ];
"@kie-tools-core/keyboard-shortcuts" [ color = "purple", fontcolor =
"purple", style = "rounded" ];
"@kie-tools-core/notifications" [ color = "purple", fontcolor = "purple",
style = "rounded" ];
"@kie-tools-core/envelope-bus" [ color = "purple", fontcolor = "purple",
style = "rounded" ];
@@ -173,7 +174,6 @@ digraph G {
"@kie-tools/runtime-tools-swf-webapp-components" [ color = "blue", fontcolor
= "blue", style = "rounded" ];
"@kie-tools/scesim-editor" [ color = "blue", fontcolor = "blue", style =
"rounded" ];
"@kie-tools/scesim-marshaller" [ color = "blue", fontcolor = "blue", style =
"rounded" ];
- "@kie-tools/scesim-editor-envelope" [ color = "blue", fontcolor = "blue",
style = "rounded" ];
"@kie-tools/serverless-logic-web-tools" [ color = "black", fontcolor =
"black", style = "dashed, rounded" ];
"@kie-tools/text-editor" [ color = "blue", fontcolor = "blue", style =
"rounded" ];
"@kie-tools/yard-editor" [ color = "blue", fontcolor = "blue", style =
"rounded" ];
@@ -380,6 +380,7 @@ digraph G {
"dmn-vscode-extension" -> "@kie-tools-core/vscode-extension" [ style =
"solid", color = "blue" ];
"dmn-vscode-extension" -> "@kie-tools/dmn-editor-envelope" [ style =
"solid", color = "blue" ];
"dmn-vscode-extension" -> "@kie-tools/kie-bc-editors" [ style = "solid",
color = "blue" ];
+ "dmn-vscode-extension" -> "@kie-tools/scesim-editor-envelope" [ style =
"solid", color = "blue" ];
"dmn-vscode-extension" -> "@kie-tools/stunner-editors" [ style = "dashed",
color = "blue" ];
"dmn-vscode-extension" ->
"@kie-tools/vscode-java-code-completion-extension-plugin" [ style = "dashed",
color = "blue" ];
"@kie-tools-core/editor" -> "@kie-tools-core/envelope" [ style = "solid",
color = "purple" ];
diff --git a/repo/graph.json b/repo/graph.json
index 5a4b9408bc6..bb756252ff8 100644
--- a/repo/graph.json
+++ b/repo/graph.json
@@ -158,6 +158,8 @@
{ "id": "@kie-tools/dmn-runner" },
{ "id": "@kie-tools/extended-services-api" },
{ "id": "dmn-vscode-extension" },
+ { "id": "@kie-tools/scesim-editor-envelope" },
+ { "id": "@kie-tools/scesim-editor" },
{ "id": "@kie-tools/extended-services" },
{ "id": "@kie-tools/extended-services-java" },
{ "id": "extended-services-vscode-extension" },
@@ -205,9 +207,7 @@
{ "id": "@kie-tools/runtime-tools-swf-enveloped-components" },
{ "id": "@kie-tools/runtime-tools-swf-gateway-api" },
{ "id": "@kie-tools/runtime-tools-swf-webapp-components" },
- { "id": "@kie-tools/scesim-editor" },
{ "id": "@kie-tools/scesim-marshaller" },
- { "id": "@kie-tools/scesim-editor-envelope" },
{ "id": "@kie-tools/serverless-logic-web-tools" },
{ "id": "@kie-tools/text-editor" },
{ "id": "@kie-tools/yard-editor" },
@@ -1652,6 +1652,11 @@
"target": "@kie-tools/kie-bc-editors",
"weight": 1
},
+ {
+ "source": "dmn-vscode-extension",
+ "target": "@kie-tools/scesim-editor-envelope",
+ "weight": 1
+ },
{
"source": "dmn-vscode-extension",
"target": "@kie-tools/stunner-editors",
@@ -1662,6 +1667,31 @@
"target": "@kie-tools/vscode-java-code-completion-extension-plugin",
"weight": 1
},
+ {
+ "source": "@kie-tools/scesim-editor-envelope",
+ "target": "@kie-tools-core/editor",
+ "weight": 1
+ },
+ {
+ "source": "@kie-tools/scesim-editor-envelope",
+ "target": "@kie-tools-core/react-hooks",
+ "weight": 1
+ },
+ {
+ "source": "@kie-tools/scesim-editor-envelope",
+ "target": "@kie-tools/scesim-editor",
+ "weight": 1
+ },
+ {
+ "source": "@kie-tools/scesim-editor",
+ "target": "@kie-tools/boxed-expression-component",
+ "weight": 1
+ },
+ {
+ "source": "@kie-tools/scesim-editor",
+ "target": "@kie-tools/scesim-marshaller",
+ "weight": 1
+ },
{
"source": "@kie-tools/extended-services",
"target": "@kie-tools/root-env",
@@ -2252,36 +2282,11 @@
"target": "@kie-tools/runtime-tools-swf-enveloped-components",
"weight": 1
},
- {
- "source": "@kie-tools/scesim-editor",
- "target": "@kie-tools/boxed-expression-component",
- "weight": 1
- },
- {
- "source": "@kie-tools/scesim-editor",
- "target": "@kie-tools/scesim-marshaller",
- "weight": 1
- },
{
"source": "@kie-tools/scesim-marshaller",
"target": "@kie-tools/xml-parser-ts-codegen",
"weight": 1
},
- {
- "source": "@kie-tools/scesim-editor-envelope",
- "target": "@kie-tools-core/editor",
- "weight": 1
- },
- {
- "source": "@kie-tools/scesim-editor-envelope",
- "target": "@kie-tools-core/react-hooks",
- "weight": 1
- },
- {
- "source": "@kie-tools/scesim-editor-envelope",
- "target": "@kie-tools/scesim-editor",
- "weight": 1
- },
{
"source": "@kie-tools/serverless-logic-web-tools",
"target": "@kie-tools-core/kubernetes-bridge",
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]
