Skip to content

Commit cf4e5b7

Browse files
davemacaulaydavemacaulay
committed
MC-2348: User can open on hover option menus when column grid size form is open
- Ensure that interaction state persists when un focusing the tabs item options
1 parent 7bdd21a commit cf4e5b7

File tree

4 files changed

+101
-4
lines changed

4 files changed

+101
-4
lines changed

‎app/code/Magento/PageBuilder/Test/Mftf/Test/AdminPageBuilderColumnGridTest.xml

Lines changed: 63 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -296,6 +296,68 @@
296296
<waitForPageLoad stepKey="waitForPageLoad"/>
297297
<waitForElementVisible time="10" selector="{{PageBuilderActionsSection.contentTypeOptionsMenu(PageBuilderRowContentType.role)}}" stepKey="waitForOptions"/>
298298
</test>
299+
<test name="ValidateGridSizeFormDisablesStageAfterTabItemOptions">
300+
<annotations>
301+
<features value="Pagebuilder"/>
302+
<stories value="Column"/>
303+
<title value="Options panels should not appear when grid form is open"/>
304+
<description value="Verify that switching directly from the tab items options to grid form keeps stage disabled"/>
305+
<severity value="CRITICAL"/>
306+
<testCaseId value="MC-2350"/>
307+
<useCaseId value="MC-950"/>
308+
<group value="pagebuilder"/>
309+
<group value="pagebuilder-column"/>
310+
<group value="pagebuilder-columnGridSize"/>
311+
<group value="pagebuilder-tabs"/>
312+
</annotations>
313+
<before>
314+
<actionGroup ref="LoginAsAdmin" stepKey="loginAsAdmin"/>
315+
<actionGroup ref="navigateToAPageWithPageBuilder" stepKey="navigateToAPageWithPageBuilder"/>
316+
<actionGroup ref="switchToPageBuilderStage" stepKey="switchToPageBuilderStage"/>
317+
</before>
318+
<after>
319+
<actionGroup ref="logout" stepKey="logOut"/>
320+
</after>
321+
<actionGroup ref="dragContentTypeToStage" stepKey="dragAdditionalRow">
322+
<argument name="contentType" value="PageBuilderRowContentType"/>
323+
</actionGroup>
324+
<actionGroup ref="dragContentTypeToStage" stepKey="dragAdditionalRow2">
325+
<argument name="contentType" value="PageBuilderRowContentType"/>
326+
</actionGroup>
327+
<actionGroup ref="dragContentTypeToContainer" stepKey="dragColumnIntoStage">
328+
<argument name="contentType" value="PageBuilderColumnContentType"/>
329+
<argument name="containerTargetType" value="PageBuilderRowContentType"/>
330+
<argument name="containerTargetIndex" value="1"/>
331+
</actionGroup>
332+
<actionGroup ref="expandPageBuilderPanelGroup" stepKey="expandPageBuilderPanelGroup">
333+
<argument name="group" value="PageBuilderTabsContentType"/>
334+
</actionGroup>
335+
<actionGroup ref="dragContentTypeToContainer" stepKey="dragTabsIntoStage">
336+
<argument name="contentType" value="PageBuilderTabsContentType"/>
337+
<argument name="containerTargetType" value="PageBuilderRowContentType"/>
338+
<argument name="containerTargetIndex" value="2"/>
339+
</actionGroup>
340+
<actionGroup ref="openGridSizeForm" stepKey="openGridSizeForm" />
341+
<!-- Validate column options don't display -->
342+
<comment userInput="Validate column options don't display" stepKey="commentColumnOptionsHidden"/>
343+
<moveMouseOver selector="{{PageBuilderColumnSection.columnX('2')}}" stepKey="moveMouseOverColumn" />
344+
<waitForPageLoad stepKey="waitForAnimations" />
345+
<waitForElement selector="{{PageBuilderActionsSection.contentTypeOptionsMenuByIndex(PageBuilderColumnContentType.role, '2')}}" stepKey="waitForColumnOptions" />
346+
<dontSee selector="{{PageBuilderActionsSection.contentTypeOptionsMenuByIndex(PageBuilderColumnContentType.role, '2')}}" stepKey="dontSeeColumnOptions" />
347+
<waitForElementNotVisible selector="{{PageBuilderActionsSection.contentTypeOptionsMenuByIndex(PageBuilderColumnContentType.role, '2')}}" stepKey="notVisibleColumnOptions" />
348+
<!-- Validate row options don't display -->
349+
<comment userInput="Validate row options don't display" stepKey="commentRowOptionsHidden"/>
350+
<moveMouseOver selector="{{PageBuilderActionsSection.contentTypeInStageByIndex(PageBuilderRowContentType.role, '3')}}" x="10" y="10" stepKey="moveMouseOverRow" />
351+
<waitForPageLoad stepKey="waitForRowAnimations" />
352+
<waitForElement selector="{{PageBuilderActionsSection.contentTypeOptionsMenuByIndex(PageBuilderRowContentType.role, '3')}}" stepKey="waitForRowOptions" />
353+
<dontSee selector="{{PageBuilderActionsSection.contentTypeOptionsMenuByIndex(PageBuilderRowContentType.role, '3')}}" stepKey="dontSeeRowOptions" />
354+
<!-- Close grid form and check options are restored -->
355+
<comment userInput="Close grid form and check options are restored" stepKey="commentCloseAndValidateOptionsAreRestored"/>
356+
<actionGroup ref="closeGridSizeForm" stepKey="closeGridForm" />
357+
<moveMouseOver selector="{{PageBuilderActionsSection.contentTypeInStage(PageBuilderRowContentType.role)}}" x="10" y="0" stepKey="onMouseOverContentTypeStage"/>
358+
<waitForPageLoad stepKey="waitForPageLoad"/>
359+
<waitForElementVisible time="10" selector="{{PageBuilderActionsSection.contentTypeOptionsMenu(PageBuilderRowContentType.role)}}" stepKey="waitForOptions"/>
360+
</test>
299361
<test name="ValidateUnfocusUpdatesGrid">
300362
<annotations>
301363
<features value="Pagebuilder"/>
@@ -833,6 +895,7 @@
833895
<description value="Verify that the grid form stays open after clicking the number spinners in input"/>
834896
<severity value="CRITICAL"/>
835897
<testCaseId value="MC-2308"/>
898+
<useCaseId value="MC-950"/>
836899
<group value="pagebuilder"/>
837900
<group value="pagebuilder-column"/>
838901
<group value="pagebuilder-columnGridSize"/>

‎app/code/Magento/PageBuilder/view/adminhtml/web/js/content-type/tabs/preview.js

Lines changed: 20 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎app/code/Magento/PageBuilder/view/adminhtml/web/ts/js/content-type-removed-params.d.ts

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,10 +3,11 @@
33
* See COPYING.txt for license details.
44
*/
55

6+
import ContentTypeCollectionInterface from "./content-type-collection.d";
67
import ContentTypeInterface from "./content-type.d";
78

89
export default interface ContentTypeRemovedParamsInterface {
9-
parent: ContentTypeInterface;
10+
parent: ContentTypeCollectionInterface;
1011
index: number;
1112
contentType: ContentTypeInterface;
1213
stageId: string;

‎app/code/Magento/PageBuilder/view/adminhtml/web/ts/js/content-type/tabs/preview.ts

Lines changed: 16 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -178,13 +178,28 @@ export default class Preview extends PreviewCollection {
178178
const focusTime = new Date().getTime();
179179
Preview.focusOperationTime = focusTime;
180180

181+
/**
182+
* Keep a reference of the state of the interaction state on the stage to check if the interaction has
183+
* restarted since we started our delay timer. This resolves issues with other aspects of the system starting
184+
* an interaction during the delay period.
185+
*/
186+
let interactionState: boolean = false;
187+
events.on("interaction:start", () => {
188+
interactionState = true;
189+
});
190+
events.on("interaction:stop", () => {
191+
interactionState = false;
192+
});
193+
181194
// Add a 200ms delay after a null set to allow for clicks to be captured
182195
_.delay(() => {
183196
if (!this.disableInteracting && Preview.focusOperationTime === focusTime) {
184197
if (index !== null) {
185198
events.trigger("interaction:start");
186199
} else {
187-
events.trigger("interaction:stop");
200+
if (interactionState !== true) {
201+
events.trigger("interaction:stop");
202+
}
188203
}
189204
}
190205
}, ((index === null) ? 200 : 0));

0 commit comments

Comments
 (0)