Skip to content

Commit e8ed034

Browse files
davemacaulaydavemacaulay
authored
Merge pull request #267 from magento-obsessive-owls/MC-15981
[Owls] Page Builder Render Update & Skip MFTF Tests
2 parents 7bb9a1b + db11e4e commit e8ed034

File tree

55 files changed

+1882
-589
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

55 files changed

+1882
-589
lines changed

‎app/code/Magento/PageBuilder/Block/Adminhtml/Stage/Render.php

Lines changed: 88 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,88 @@
1+
<?php
2+
/**
3+
* Copyright © Magento, Inc. All rights reserved.
4+
* See COPYING.txt for license details.
5+
*/
6+
7+
declare(strict_types=1);
8+
9+
namespace Magento\PageBuilder\Block\Adminhtml\Stage;
10+
11+
use Magento\Framework\View\Element\Template;
12+
use Magento\RequireJs\Model\FileManager;
13+
use Magento\PageBuilder\Model\Stage\Config;
14+
use Magento\Framework\Serialize\Serializer\Json;
15+
16+
/**
17+
* Class Render
18+
*/
19+
class Render extends Template
20+
{
21+
/**
22+
* @var FileManager
23+
*/
24+
private $fileManager;
25+
26+
/**
27+
* @var Config
28+
*/
29+
private $pageBuilderConfig;
30+
31+
/**
32+
* @var Json
33+
*/
34+
private $json;
35+
36+
/**
37+
* @param Template\Context $context
38+
* @param FileManager $fileManager
39+
* @param Config $config
40+
* @param Json $json
41+
* @param array $data
42+
*/
43+
public function __construct(
44+
Template\Context $context,
45+
FileManager $fileManager,
46+
Config $config,
47+
Json $json,
48+
array $data = []
49+
) {
50+
parent::__construct($context, $data);
51+
$this->fileManager = $fileManager;
52+
$this->pageBuilderConfig = $config;
53+
$this->json = $json;
54+
}
55+
56+
/**
57+
* Generate the URL to RequireJS
58+
*
59+
* @return string
60+
* @throws \Magento\Framework\Exception\LocalizedException
61+
*/
62+
public function getRequireJsUrl() : string
63+
{
64+
$asset = $this->_assetRepo->createAsset('requirejs/require.js');
65+
return $asset->getUrl();
66+
}
67+
68+
/**
69+
* Retrieve the URL to the RequireJS Config file
70+
*
71+
* @return string
72+
*/
73+
public function getRequireJsConfigUrl() : string
74+
{
75+
$requireJsConfig = $this->fileManager->createRequireJsConfigAsset();
76+
return $requireJsConfig->getUrl();
77+
}
78+
79+
/**
80+
* Retrieve the Page Builder's config
81+
*
82+
* @return array
83+
*/
84+
public function getPageBuilderConfig() : string
85+
{
86+
return $this->json->serialize($this->pageBuilderConfig->getConfig());
87+
}
88+
}

‎app/code/Magento/PageBuilder/Controller/Adminhtml/Stage/Render.php

Lines changed: 49 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,49 @@
1+
<?php
2+
/**
3+
*
4+
* Copyright © Magento, Inc. All rights reserved.
5+
* See COPYING.txt for license details.
6+
*/
7+
8+
namespace Magento\PageBuilder\Controller\Adminhtml\Stage;
9+
10+
use Magento\Framework\App\Action\HttpGetActionInterface;
11+
use Magento\RequireJs\Block\Html\Head\Config;
12+
13+
/**
14+
* Class Render
15+
*
16+
* Iframe to render Page Builder stage in isolation
17+
*/
18+
class Render extends \Magento\Backend\App\Action implements HttpGetActionInterface
19+
{
20+
const ADMIN_RESOURCE = 'Magento_Backend::content';
21+
22+
/**
23+
* Render the RequireJS and Page Builder render blocks without any additional layout
24+
*
25+
* @return void
26+
*/
27+
public function execute()
28+
{
29+
$layout = $this->_view->getLayout();
30+
$requireJs = $layout->createBlock(
31+
\Magento\Backend\Block\Page\RequireJs::class,
32+
'require.js'
33+
);
34+
$requireJs->setTemplate('Magento_Backend::page/js/require_js.phtml');
35+
/* @var \Magento\PageBuilder\Block\Adminhtml\Stage\Render $renderBlock */
36+
$renderBlock = $layout->createBlock(
37+
\Magento\PageBuilder\Block\Adminhtml\Stage\Render::class,
38+
'stage_render'
39+
);
40+
$renderBlock->setTemplate('Magento_PageBuilder::stage/render.phtml');
41+
$babelPolyfill = $layout->createBlock(
42+
\Magento\PageBuilder\Block\Adminhtml\Html\Head\BabelPolyfill::class,
43+
'pagebuilder.babel.polyfill'
44+
);
45+
$babelPolyfill->setTemplate('Magento_PageBuilder::html/head/babel_polyfill.phtml');
46+
$this->getResponse()->setBody($requireJs->toHtml() . $babelPolyfill->toHtml() . $renderBlock->toHtml());
47+
$this->getResponse()->sendResponse();
48+
}
49+
}

‎app/code/Magento/PageBuilder/Model/Stage/Config.php

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -138,6 +138,7 @@ public function getConfig()
138138
'preview_url' => $this->frontendUrlBuilder
139139
->addSessionParam()
140140
->getUrl('pagebuilder/contenttype/preview'),
141+
'render_url' => $this->urlBuilder->getUrl('pagebuilder/stage/render'),
141142
'column_grid_default' => $this->scopeConfig->getValue(self::XML_PATH_COLUMN_GRID_DEFAULT),
142143
'column_grid_max' => $this->scopeConfig->getValue(self::XML_PATH_COLUMN_GRID_MAX),
143144
'can_use_inline_editing_on_stage' => $this->isWysiwygProvisionedForEditingOnStage(),

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

Lines changed: 0 additions & 119 deletions
Original file line numberDiff line numberDiff line change
@@ -8,125 +8,6 @@
88

99
<tests xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
1010
xsi:noNamespaceSchemaLocation="urn:magento:mftf:Test/etc/testSchema.xsd">
11-
<test name="ImageContentBlockDeleteImage">
12-
<annotations>
13-
<features value="PageBuilder"/>
14-
<stories value="Image"/>
15-
<title value="Image from Image Content Block get wiped out after delete image from Media Storage"/>
16-
<description value="Image from Image Content Block get wiped out after delete image from Media Storage"/>
17-
<severity value="MAJOR"/>
18-
<useCaseId value="MC-2294"/>
19-
<testCaseId value="MC-3494"/>
20-
<group value="pagebuilder"/>
21-
<group value="pagebuilder-image"/>
22-
<skip>
23-
<issueId value="MC-4306"/>
24-
</skip>
25-
</annotations>
26-
<before>
27-
<actionGroup ref="LoginAsAdmin" stepKey="loginAsAdmin"/>
28-
<actionGroup ref="navigateToAPageWithPageBuilder" stepKey="navigateToAPageWithPageBuilder"/>
29-
<actionGroup ref="switchToPageBuilderStage" stepKey="switchToPageBuilderStage"/>
30-
</before>
31-
<after>
32-
<actionGroup ref="logout" stepKey="logout"/>
33-
</after>
34-
<actionGroup ref="addPageBuilderPageTitle" stepKey="enterPageTitle">
35-
<argument name="contentType" value="PageBuilderImageContentType"/>
36-
</actionGroup>
37-
<actionGroup ref="expandPageBuilderPanelMenuSection" stepKey="expandPageBuilderPanelMenuSection">
38-
<argument name="contentType" value="PageBuilderImageContentType"/>
39-
</actionGroup>
40-
<actionGroup ref="dragContentTypeToStage" stepKey="dragImageIntoStage">
41-
<argument name="contentType" value="PageBuilderImageContentType"/>
42-
</actionGroup>
43-
<!-- Attach image A to PageBuilder stage -->
44-
<comment userInput="Attach image A to PageBuilder stage" stepKey="attachImageToStage"/>
45-
<actionGroup ref="uploadImageToContentTypeFromStage" stepKey="addImageToStage">
46-
<argument name="property" value="PageBuilderImageProperty_StageJPG"/>
47-
<argument name="section" value="ImageOnStageWithoutImageUploaded"/>
48-
</actionGroup>
49-
<!-- Go to Media Storage from stage-->
50-
<comment userInput="Go to Media Storage from stage" stepKey="commentGoToMediaStorageFromStage"/>
51-
<actionGroup ref="goToMediaStorageFromStage" stepKey="goToMediaStorageFromStage1" >
52-
<argument name="contentType" value="PageBuilderImageContentType"/>
53-
</actionGroup>
54-
<!--Delete image A-->
55-
<comment stepKey="deleteImageA" userInput="Delete image A"/>
56-
<actionGroup ref="DeleteImageFromStorageActionGroup" stepKey="DeleteImageFromStorage1">
57-
<argument name="Image" value="PageBuilderImageProperty_StageJPG"/>
58-
</actionGroup>
59-
<click selector="{{MediaGallerySection.CancelBtn}}" stepKey="closeSlideOut1"/>
60-
<!-- Assert don't see deleted image on stage -->
61-
<comment userInput="Assert don't see deleted image on stage" stepKey="assertNotToSeeImage"/>
62-
<seeElementInDOM selector="{{ImageOnStageWithoutImageUploaded.imageEmptyPreview}}" stepKey="dontSeeImageOnStage1"/>
63-
<dontSeeElementInDOM selector="{{ImageOnStageWithoutImageUploaded.imageSource(PageBuilderImageProperty_StageJPG.fileName)}}" stepKey="dontSeeImageInDOM1"/>
64-
<!-- Attach image C to Image slideout form -->
65-
<comment userInput="Attach image C to Image slideout form" stepKey="attachImageToSlideOut"/>
66-
<actionGroup ref="openPageBuilderEditPanel" stepKey="openEditMenuOnStage1">
67-
<argument name="contentType" value="PageBuilderImageContentType"/>
68-
</actionGroup>
69-
<actionGroup ref="attachFileSlideOutPropertyGeneral" stepKey="attachImageFile1">
70-
<argument name="property" value="PageBuilderImageProperty_StageJPG"/>
71-
</actionGroup>
72-
<actionGroup ref="verifyImageOnSlideout" stepKey="verifyImageOnSlideout1">
73-
<argument name="property" value="PageBuilderImageProperty_StageJPG"/>
74-
</actionGroup>
75-
<!-- Delete image C-->
76-
<comment stepKey="deleteImageC" userInput="Delete image C"/>
77-
<actionGroup ref="clickSelectFromGallerySlideOut" stepKey="clickSelectFromGallerySlideOut">
78-
<argument name="property" value="PageBuilderImageProperty_StageJPG"/>
79-
</actionGroup>
80-
<actionGroup ref="DeleteImageFromStorageActionGroup" stepKey="DeleteImageFromStorage3">
81-
<argument name="Image" value="PageBuilderImageProperty_StageJPG"/>
82-
</actionGroup>
83-
<click selector="{{MediaGallerySection.CancelBtn}}" stepKey="closeSlideOut3"/>
84-
<actionGroup ref="seeNoImageUploadedOnSlideOut" stepKey="validateNoImage">
85-
<argument name="property" value="PageBuilderImageProperty_StageJPG"/>
86-
</actionGroup>
87-
<actionGroup ref="closeEditPanelSettings" stepKey="closeEditPanelSettings"/>
88-
<seeElementInDOM selector="{{ImageOnStageWithoutImageUploaded.imageEmptyPreview}}" stepKey="dontSeeImageOnStage2"/>
89-
<!-- Attach image B to Image slideout form from Media Storage -->
90-
<comment userInput="Attach image B to Image slideout form from Media Storage" stepKey="attachImageBToSlideout"/>
91-
<actionGroup ref="openPageBuilderEditPanel" stepKey="openEditMenuOnStage2">
92-
<argument name="contentType" value="PageBuilderImageContentType"/>
93-
</actionGroup>
94-
<click selector="{{EditPanelForm.selectFromGalleryBtn(PageBuilderImageProperty_StageJPG.section, PageBuilderImageProperty_StageJPG.fieldName)}}" stepKey="clickSelectfromGallery"/>
95-
<waitForPageLoad stepKey="waitForPageLoad"/>
96-
<click selector="{{MediaGallerySection.StorageRootArrow}}" stepKey="clickStorageRoot"/>
97-
<waitForPageLoad stepKey="waitForPageLoad2"/>
98-
<actionGroup ref="CreateImageFolder" stepKey="createImageFolder">
99-
<argument name="ImageFolder" value="ImageFolder"/>
100-
</actionGroup>
101-
<actionGroup ref="attachImage" stepKey="SelectImageFromMediaStorage">
102-
<argument name="Image" value="PageBuilderImageProperty_StageJPG"/>
103-
</actionGroup>
104-
<actionGroup ref="saveImage" stepKey="saveImage"/>
105-
<actionGroup ref="verifyImageOnSlideout" stepKey="verifyImageOnSlideout2">
106-
<argument name="property" value="PageBuilderImageProperty_StageJPG"/>
107-
</actionGroup>
108-
<!-- Delete image B -->
109-
<comment stepKey="deleteImageB" userInput="Delete image B"/>
110-
<actionGroup ref="clickSelectFromGallerySlideOut" stepKey="clickSelectFromGallerySlideOut2">
111-
<argument name="property" value="PageBuilderImageProperty_StageJPG"/>
112-
</actionGroup>
113-
<actionGroup ref="NavigateToMediaFolderActionGroup" stepKey="navigateToMediaFolder">
114-
<argument name="FolderName" value="{{ImageFolder.name}}"/>
115-
</actionGroup>
116-
<actionGroup ref="DeleteImageFromStorageActionGroup" stepKey="DeleteImageFromStorage4">
117-
<argument name="Image" value="PageBuilderImageProperty_StageJPG"/>
118-
</actionGroup>
119-
<click selector="{{MediaGallerySection.CancelBtn}}" stepKey="closeSlideOut4"/>
120-
<waitForPageLoad stepKey="waitForPageLoad3"/>
121-
<actionGroup ref="seeNoImageUploadedOnSlideOut" stepKey="validateNoImage1">
122-
<argument name="property" value="PageBuilderImageProperty_StageJPG"/>
123-
</actionGroup>
124-
<actionGroup ref="closeEditPanelSettings" stepKey="closeEditPanelSettings2"/>
125-
<!-- Assert not to see image on stage -->
126-
<comment userInput="Assert not to see image on stage" stepKey="commentVerifyImageStage" />
127-
<seeElementInDOM selector="{{ImageOnStageWithoutImageUploaded.imageEmptyPreview}}" stepKey="dontSeeImageOnStage3"/>
128-
<dontSeeElementInDOM selector="{{ImageOnStageWithoutImageUploaded.imageSource(PageBuilderImageProperty_StageJPG.fileName)}}" stepKey="dontSeeImageInDOM2"/>
129-
</test>
13011
<test name="ImageAddImageIntoPageBuilderStage">
13112
<annotations>
13213
<features value="PageBuilder"/>

‎app/code/Magento/PageBuilder/composer.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,7 @@
1616
"magento/module-rule": "*",
1717
"magento/module-directory": "*",
1818
"magento/module-email": "*",
19+
"magento/module-require-js": "*",
1920
"php": "~7.1.3||~7.2.0"
2021
},
2122
"conflict": {

‎app/code/Magento/PageBuilder/view/adminhtml/requirejs-config.js

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -32,6 +32,9 @@ var config = {
3232
},
3333
'mage/validation': {
3434
'Magento_PageBuilder/js/system/config/validator-rules-mixin': true
35+
},
36+
'Magento_Ui/js/form/form': {
37+
'Magento_PageBuilder/js/form/form-mixin': true
3538
}
3639
}
3740
}

‎app/code/Magento/PageBuilder/view/adminhtml/templates/stage/render.phtml

Lines changed: 49 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,49 @@
1+
<?php
2+
/**
3+
* Copyright © Magento, Inc. All rights reserved.
4+
* See COPYING.txt for license details.
5+
*/
6+
7+
/** @var \Magento\PageBuilder\Block\Adminhtml\Stage\Render $block */
8+
?>
9+
<script src="<?= $block->escapeUrl($block->getRequireJsUrl()); ?>"></script>
10+
<script src="<?= $block->escapeUrl($block->getRequireJsConfigUrl()); ?>"></script>
11+
<script>
12+
<?php
13+
/**
14+
* Override the text! plugin within the iframe to ensure we can pipe any XHR requests through to the parent window
15+
* as the same origin policy will not allow us to load the templates within this iframe.
16+
*/
17+
?>
18+
require.config({
19+
'map': {
20+
'*': {
21+
'text': 'Magento_PageBuilder/js/master-format/render/requirejs/text',
22+
}
23+
},
24+
});
25+
26+
<?php
27+
/**
28+
* To be able to override the text plugin we need the Magento template engine to be used, as the template engine
29+
* within lib has a dependency on the text! plugin we need to ensure we set the template engine before the
30+
* dependency blocks us. If we try to just override using the RequireJS config above our !text plugin will never
31+
* get overridden as our template engine cannot load.
32+
*/
33+
?>
34+
require([
35+
'ko',
36+
'Magento_Ui/js/lib/knockout/template/engine'
37+
], function (ko, templateEngine) {
38+
'use strict';
39+
40+
ko.uid = 0;
41+
ko.setTemplateEngine(templateEngine);
42+
});
43+
</script>
44+
<script>
45+
require(['Magento_PageBuilder/js/master-format/render/frame'], function (listen) {
46+
listen(<?= /* @noEscape */ $block->getPageBuilderConfig(); ?>);
47+
});
48+
</script>
49+
<div>Page Builder Render Frame</div>

‎app/code/Magento/PageBuilder/view/adminhtml/web/css/source/_config.less

Lines changed: 0 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -44,20 +44,4 @@
4444
}
4545
}
4646
}
47-
._required {
48-
> .admin__field-label {
49-
> label:after {
50-
color: @color-tomato-brick;
51-
content: '*';
52-
display: inline-block;
53-
font-size: 1.6rem;
54-
font-weight: 500;
55-
line-height: 1;
56-
margin-left: 10px;
57-
margin-top: .2rem;
58-
position: absolute;
59-
z-index: 1;
60-
}
61-
}
62-
}
6347
}

‎app/code/Magento/PageBuilder/view/adminhtml/web/js/config.js

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

0 commit comments

Comments
 (0)