Merge pull request #658 from joweecaquicla/viewport-switcher-update

[WIP] Viewport switcher update

Author: omiroshnichenko

README.md

@@ -6,14 +6,25 @@ Welcome to the Magento 2 Page Builder project!
 
 Page Builder introduces an intuitive, drag-and-drop interface for creating digital content, powered by content types like images, videos, banners, etc. with instant preview capabilities that enable non-technical users to take control of their content. It allows to create new pages, enrich products and categories, and launch content updates quickly and easily without the help of a front-end web developer.
 
+## Wiki
+
+Public access to the Page Builder wiki is found here:
+
+https://github.com/magento/magento2-page-builder-docs/wiki.
+
+The wiki provides more information on the Page Builder project, such as:
+
+- [Links to User Guide tutorials](https://github.com/magento/magento2-page-builder-docs/wiki#page-builder-tutorials)
+- [Page Builder roadmaps](https://github.com/magento/magento2-page-builder-docs/wiki#roadmap)
+- [MFTF best practices](https://github.com/magento/magento2-page-builder-docs/wiki/%5BRough-Draft%5D-MFTF-Best-Practices)
+- [Partners Acceleration Program](https://github.com/magento/magento2-page-builder-docs/wiki/Partners-Acceleration-Program-Team)
+
 ## Documentation
-Complete documentation located on the [Magento DevDocs](https://devdocs.magento.com/page-builder/docs/):
-  - Project [roadmap](https://github.com/magento/magento2-page-builder/wiki#roadmap) contains information about project phases 
-  - How to start local development described in the [installation guide](https://devdocs.magento.com/page-builder/docs/getting-started/install-pagebuilder.html)
+Complete documentation located on the [Magento DevDocs](https://devdocs.magento.com/page-builder/docs/), including what you need to know to start local development as described in the [installation guide](https://devdocs.magento.com/page-builder/docs/getting-started/install-pagebuilder.html).
 
 ## Community Engineering Slack
 
-To connect with Magento team and the Community, join us on the [Magento Community Engineering Slack](https://magentocommeng.slack.com). 
+To connect with Magento team and the Community, join us on the [Magento Community Engineering Slack](https://magentocommeng.slack.com).
 If you are interested in joining Slack, or a specific channel, use our [self signup](https://opensource.magento.com/slack) link.
 
 Magento 2 Page Builder project slack channel: [#pagebuilder](https://magentocommeng.slack.com/archives/CHB455HPF)

app/code/Magento/PageBuilder/Model/Dom/Adapter/DocumentInterface.php

@@ -29,6 +29,15 @@ public function __toString(): string;
      */
     public function createDocumentFragment(): DocumentFragmentInterface;
 
+    /**
+     * Create new document element
+     *
+     * @param string $name
+     * @param string $value [optional]
+     * @return ElementInterface
+     */
+    public function createElement(string $name, string $value = null);
+
     /**
      * Returns the first element matching the specified selector.
      *

app/code/Magento/PageBuilder/Model/Dom/Adapter/ElementInterface.php

@@ -7,11 +7,28 @@
 
 namespace Magento\PageBuilder\Model\Dom\Adapter;
 
+use Gt\Dom\Element as GtDomElement;
+
 /**
  * Interface for Element wrappers
  */
 interface ElementInterface
 {
+    /**
+     * Return original element.
+     *
+     * @return GtDomElement
+     */
+    public function getOriginalElement(): GtDomElement;
+
+    /**
+     * Adds new child at the end of the children.
+     *
+     * @param ElementInterface $element
+     * @return ElementInterface
+     */
+    public function appendChild(ElementInterface $element): ElementInterface;
+
     /**
      * Returns true if the element would be selected by the specified selector string; otherwise, returns false.
      *
@@ -45,6 +62,14 @@ public function closest(string $selectors): ?ElementInterface;
      */
     public function getAttribute($name): ?string;
 
+    /**
+     * Removes the Specified Attribute
+     *
+     * @param string $name
+     * @return bool|null
+     */
+    public function removeAttribute($name): ?bool;
+
     /**
      * Sets the value of the specified attribute
      *

app/code/Magento/PageBuilder/Model/Dom/Document.php

@@ -62,6 +62,17 @@ public function createDocumentFragment(): DocumentFragmentInterface
         );
     }
 
+    /**
+     * @inheritDoc
+     */
+    public function createElement(string $name, string $value = null): ElementInterface
+    {
+        return $this->objectManager->create(
+            ElementInterface::class,
+            [ 'element' => $this->document->createElement($name, $value) ]
+        );
+    }
+
     /**
      * @inheritDoc
      */

app/code/Magento/PageBuilder/Model/Dom/Element.php

@@ -41,6 +41,25 @@ public function __construct(
         $this->element = $element;
     }
 
+    /**
+     * @inheritDoc
+     */
+    public function getOriginalElement(): GtDomElement
+    {
+        return $this->element;
+    }
+
+    /**
+     * @inheritDoc
+     */
+    public function appendChild(ElementInterface $element): ElementInterface
+    {
+        return $this->objectManager->create(
+            ElementInterface::class,
+            [ 'element' => $this->element->appendChild($element->getOriginalElement()) ]
+        );
+    }
+
     /**
      * @inheritDoc
      */
@@ -79,6 +98,14 @@ public function getAttribute($name): ?string
         return $this->element->getAttribute($name);
     }
 
+    /**
+     * @inheritDoc
+     */
+    public function removeAttribute($name): ?bool
+    {
+        return $this->element->removeAttribute($name);
+    }
+
     /**
      * @inheritDoc
      */

app/code/Magento/PageBuilder/Model/Stage/Preview.php

@@ -7,38 +7,47 @@
 
 namespace Magento\PageBuilder\Model\Stage;
 
+use Magento\Framework\App\Area;
+use Magento\Framework\App\Config\ScopeConfigInterface;
+use Magento\Framework\App\State;
+use Magento\Framework\View\Design\Theme\ThemeProviderInterface;
+use Magento\Framework\View\DesignInterface;
+use Magento\Store\Model\App\Emulation;
+use Magento\Store\Model\ScopeInterface;
+use Magento\Store\Model\StoreManagerInterface;
+
 /**
  * Handle placing Magento into Page Builder Preview mode and emulating the store front
  */
 class Preview
 {
     /**
-     * @var \Magento\Store\Model\App\Emulation
+     * @var Emulation
      */
     private $emulation;
 
     /**
-     * @var \Magento\Framework\App\State
+     * @var State
      */
     private $appState;
 
     /**
-     * @var \Magento\Framework\View\DesignInterface
+     * @var DesignInterface
      */
     private $design;
 
     /**
-     * @var \Magento\Framework\View\Design\Theme\ThemeProviderInterface
+     * @var ThemeProviderInterface
      */
     private $themeProvider;
 
     /**
-     * @var \Magento\Store\Model\StoreManagerInterface
+     * @var StoreManagerInterface
      */
     private $storeManager;
 
     /**
-     * @var \Magento\Framework\App\Config\ScopeConfigInterface
+     * @var ScopeConfigInterface
      */
     private $scopeConfig;
 
@@ -49,20 +58,20 @@ class Preview
 
     /**
      * Preview constructor.
-     * @param \Magento\Store\Model\App\Emulation $emulation
-     * @param \Magento\Framework\App\State $appState
-     * @param \Magento\Framework\View\DesignInterface $design
-     * @param \Magento\Framework\View\Design\Theme\ThemeProviderInterface $themeProvider
-     * @param \Magento\Store\Model\StoreManagerInterface $storeManager
-     * @param \Magento\Framework\App\Config\ScopeConfigInterface $scopeConfig
+     * @param Emulation $emulation
+     * @param State $appState
+     * @param DesignInterface $design
+     * @param ThemeProviderInterface $themeProvider
+     * @param StoreManagerInterface $storeManager
+     * @param ScopeConfigInterface $scopeConfig
      */
     public function __construct(
-        \Magento\Store\Model\App\Emulation $emulation,
-        \Magento\Framework\App\State $appState,
-        \Magento\Framework\View\DesignInterface $design,
-        \Magento\Framework\View\Design\Theme\ThemeProviderInterface $themeProvider,
-        \Magento\Store\Model\StoreManagerInterface $storeManager,
-        \Magento\Framework\App\Config\ScopeConfigInterface $scopeConfig
+        Emulation $emulation,
+        State $appState,
+        DesignInterface $design,
+        ThemeProviderInterface $themeProvider,
+        StoreManagerInterface $storeManager,
+        ScopeConfigInterface $scopeConfig
     ) {
         $this->emulation = $emulation;
         $this->appState = $appState;
@@ -79,7 +88,7 @@ public function __construct(
      */
     public function getPreviewArea() : string
     {
-        return \Magento\Framework\App\Area::AREA_FRONTEND;
+        return Area::AREA_FRONTEND;
     }
 
     /**
@@ -95,7 +104,7 @@ public function startPreviewMode($callback, $storeId = null)
         $this->isPreview = true;
 
         if (!$storeId) {
-            $storeId = $this->storeManager->getDefaultStoreView()->getId();
+            $storeId = $this->getStoreId();
         }
         $this->emulation->startEnvironmentEmulation($storeId);
 
@@ -104,7 +113,7 @@ public function startPreviewMode($callback, $storeId = null)
             function () use ($callback) {
                 $themeId = $this->scopeConfig->getValue(
                     'design/theme/theme_id',
-                    \Magento\Store\Model\ScopeInterface::SCOPE_STORE
+                    ScopeInterface::SCOPE_STORE
                 );
                 $theme = $this->themeProvider->getThemeById($themeId);
                 $this->design->setDesignTheme($theme, $this->getPreviewArea());
@@ -131,4 +140,26 @@ public function isPreviewMode() : bool
     {
         return $this->isPreview;
     }
+
+    /**
+     * Returns store id by default store view or store id from the available store if default store view is null
+     *
+     * @return int|null
+     */
+    private function getStoreId(): ?int
+    {
+        $storeId = null;
+        $store = $this->storeManager->getDefaultStoreView();
+        if ($store) {
+            $storeId = (int) $store->getId();
+        } else {
+            $stores = $this->storeManager->getStores();
+            if (count($stores)) {
+                $store = array_shift($stores);
+                $storeId = (int) $store->getId();
+            }
+        }
+
+        return $storeId;
+    }
 }

app/code/Magento/PageBuilder/Model/Validator/IframeSrcAttributeValidator.php

@@ -0,0 +1,64 @@
+<?php
+/**
+ * Copyright © Magento, Inc. All rights reserved.
+ * See COPYING.txt for license details.
+ */
+
+declare(strict_types=1);
+
+namespace Magento\PageBuilder\Model\Validator;
+
+use Magento\Framework\Validation\ValidationException;
+use Magento\Framework\Validator\HTML\AttributeValidatorInterface;
+
+/**
+ * Validates "src" of iframes.
+ */
+class IframeSrcAttributeValidator implements AttributeValidatorInterface
+{
+    /**
+     * @var string[]
+     */
+    private $allowedHosts;
+
+    /**
+     * IframeSrcAttributeValidator constructor.
+     *
+     * @param string[] $allowedHosts
+     */
+    public function __construct(array $allowedHosts)
+    {
+        $this->allowedHosts = $allowedHosts;
+    }
+
+    /**
+     * @inheritDoc
+     */
+    public function validate(string $tag, string $attributeName, string $value): void
+    {
+        if ($tag !== 'iframe' || $attributeName !== 'src') {
+            return;
+        }
+
+        if (mb_strpos($value, 'http') !== 0) {
+            //Relative link
+            return;
+        }
+        // phpcs:ignore Magento2.Functions.DiscouragedFunction
+        $srcHost = parse_url($value, PHP_URL_HOST);
+        if (!$srcHost || !$this->allowedHosts) {
+            //Either the link is invalid or we do not have the allowed list.
+            return;
+        }
+        $srcHostLength = mb_strlen($srcHost);
+        foreach ($this->allowedHosts as $host) {
+            $hostLength = mb_strlen($host);
+            $foundIndex = mb_strpos($srcHost, $host);
+            if ($foundIndex !== false && ($foundIndex + $hostLength) === $srcHostLength) {
+                return;
+            }
+        }
+
+        throw new ValidationException(__('Invalid IFRAME source provided'));
+    }
+}

app/code/Magento/PageBuilder/Model/Validator/InnerHtmlValidator.php

@@ -0,0 +1,39 @@
+<?php
+/**
+ * Copyright © Magento, Inc. All rights reserved.
+ * See COPYING.txt for license details.
+ */
+
+declare(strict_types=1);
+
+namespace Magento\PageBuilder\Model\Validator;
+
+use Magento\Framework\Validator\HTML\TagValidatorInterface;
+use Magento\Framework\Validator\HTML\WYSIWYGValidatorInterface;
+
+/**
+ * Validates HTML elements.
+ */
+class InnerHtmlValidator implements TagValidatorInterface
+{
+    private const HTML_TYPE_ATTRIBUTE = 'data-content-type';
+
+    /**
+     * @inheritDoc
+     */
+    public function validate(
+        string $tag,
+        array $attributes,
+        string $value,
+        WYSIWYGValidatorInterface $recursiveValidator
+    ): void {
+        if (!array_key_exists(self::HTML_TYPE_ATTRIBUTE, $attributes)
+            || strtolower($attributes[self::HTML_TYPE_ATTRIBUTE]) !== 'html'
+        ) {
+            return;
+        }
+
+        // phpcs:ignore Magento2.Functions.DiscouragedFunction
+        $recursiveValidator->validate(html_entity_decode($value));
+    }
+}