Merge branch 'MC-1416' into team3-delivery

irenelagno · irenelagno · commit 0384fe025d53 · 2018-08-06T10:30:02.000-05:00
diff --git a/app/code/Magento/Cms/Test/Mftf/ActionGroup/VerifyTinyMCEActionGroup.xml b/app/code/Magento/Cms/Test/Mftf/ActionGroup/VerifyTinyMCEActionGroup.xml
@@ -8,8 +8,6 @@
 <actionGroups xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
               xsi:noNamespaceSchemaLocation="../../../../../../../dev/tests/acceptance/vendor/magento/magento2-functional-testing-framework/src/Magento/FunctionalTestingFramework/Test/etc/actionGroupSchema.xsd">
     <actionGroup name="VerifyTinyMCEActionGroup">
-        <waitForElementVisible selector="{{TinyMCESection.TinyMCE4}}" stepKey="waitForTinyMCE" time="30" />
-        <seeElement selector="{{TinyMCESection.TinyMCE4}}" stepKey="seeTinyMCE4" />
         <seeElement selector="{{TinyMCESection.Style}}" stepKey="assertInfo2"/>
         <seeElement selector="{{TinyMCESection.Bold}}" stepKey="assertInfo3"/>
         <seeElement selector="{{TinyMCESection.Italic}}" stepKey="assertInfo4"/>
diff --git a/app/code/Magento/Cms/Test/Mftf/Data/CmsPageData.xml b/app/code/Magento/Cms/Test/Mftf/Data/CmsPageData.xml
@@ -75,6 +75,7 @@
         <data key="extension">jpg</data>
         <data key="content">Image content. Yeah.</data>
         <data key="height">1000</data>
+        <data key="path">wysiwyg</data>
     </entity>
     <entity name="ImageFolder" type="uploadImage">
         <data key="name" unique="suffix">Test</data>
diff --git a/app/code/Magento/Cms/Test/Mftf/Section/CmsNewPagePageContentSection.xml b/app/code/Magento/Cms/Test/Mftf/Section/CmsNewPagePageContentSection.xml
@@ -19,6 +19,7 @@
         <element name="InsertWidgetBtn" type="button" selector=".action-add-widget"/>
         <element name="InsertVariableBtn" type="button" selector=".scalable.add-variable.plugin"/>
         <element name="InsertImageBtn" type="button" selector=".scalable.action-add-image.plugin"/>
+        <element name="imageSource" type="text" selector="//img[contains(@src,'{{var1}}')]" parameterized="true"/>
     </section>
     <section name="CmsDesignSection">
         <element name="DesignTab" type="button" selector="//strong[@class='admin__collapsible-title']//span[text()='Design']"/>
diff --git a/app/code/Magento/Cms/Test/Mftf/Section/TinyMCESection.xml b/app/code/Magento/Cms/Test/Mftf/Section/TinyMCESection.xml
@@ -98,9 +98,6 @@
         <element name="PageSize" type="input" selector="input[name='parameters[page_size]']"/>
         <element name="ProductAttribute" type="multiselect" selector="select[name='parameters[show_attributes][]']" />
         <element name="ButtonToShow" type="multiselect" selector="select[name='parameters[show_buttons][]']"/>
-        <!--Widget on Storefront-->
-        <element name="CategoryWidget" type="text" selector="//a[@href='http://magento2.vagrant42/{{var1}}.html?___store=default']" parameterized="true"/>
-        <element name="CMSPageWidget" type="text" selector="//a[@href='http://magento2.vagrant42/home']"/>
         <!--Compare on Storefront-->
         <element name="ProductName" type="text" selector=".product.name.product-item-name" />
         <element name="CompareBtn" type="button" selector=".action.tocompare"/>
diff --git a/app/code/Magento/Config/Test/Mftf/ActionGroup/UseStaticURLForMediaContentInWYSIWYGActionGroup.xml b/app/code/Magento/Config/Test/Mftf/ActionGroup/UseStaticURLForMediaContentInWYSIWYGActionGroup.xml
@@ -0,0 +1,20 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!--
+ /**
+  * Copyright © Magento, Inc. All rights reserved.
+  * See COPYING.txt for license details.
+  */
+-->
+
+<actionGroups xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
+        xsi:noNamespaceSchemaLocation="../../../../../../../dev/tests/acceptance/vendor/magento/magento2-functional-testing-framework/src/Magento/FunctionalTestingFramework/Test/etc/actionGroupSchema.xsd">
+    <actionGroup name="useStaticURLForMediaContentInWYSIWYGActionGroup">
+        <amOnPage url="{{ConfigurationStoresPage.url}}" stepKey="navigateToWYSIWYGConfigPage1"/>
+        <waitForPageLoad stepKey="waitForPageLoad"/>
+        <conditionalClick stepKey="expandWYSIWYGOptions" selector="{{ContentManagementSection.WYSIWYGOptions}}" dependentSelector="{{ContentManagementSection.CheckIfTabExpand}}" visible="true" />
+        <waitForElementVisible selector="{{ContentManagementSection.EnableWYSIWYG}}" stepKey="waitForEnableWYSIWYGDropdown1" />
+        <selectOption selector="{{ContentManagementSection.StaticURL}}" userInput="Yes" stepKey="selectOption1"/>
+        <click selector="{{ContentManagementSection.WYSIWYGOptions}}" stepKey="collapseWYSIWYGOptions" />
+        <click selector="{{ContentManagementSection.Save}}" stepKey="saveConfig" />
+    </actionGroup>
+</actionGroups>
diff --git a/app/code/Magento/Config/Test/Mftf/Section/GeneralSection.xml b/app/code/Magento/Config/Test/Mftf/Section/GeneralSection.xml
@@ -15,6 +15,7 @@
         <element name="EnableWYSIWYG" type="button" selector="#cms_wysiwyg_enabled"/>
         <element name="SwitcherSystemValue" type="button" selector="#cms_wysiwyg_editor_inherit"/>
         <element name="Switcher" type="button" selector="#cms_wysiwyg_editor" />
+        <element name="StaticURL" type="button" selector="#cms_wysiwyg_use_static_urls_in_catalog" />
         <element name="Save" type="button" selector="#save"/>
     </section>
     <section name="WebSection">
diff --git a/app/code/Magento/Tinymce3/view/base/web/tinymce3Adapter.js b/app/code/Magento/Tinymce3/view/base/web/tinymce3Adapter.js
@@ -495,7 +495,7 @@ define([
          */
         encodeDirectives: function (content) {
             // collect all HTML tags with attributes that contain directives
-            return content.gsub(/<([a-z0-9\-\_]+[^>]+?)([a-z0-9\-\_]+=".*?\{\{.+?\}\}.*?".*?)>/i, function (match) {
+            return content.gsub(/<([a-z0-9\-\_]+[^>]+?)([a-z0-9\-\_]+="[^"]*?\{\{.+?\}\}.*?".*?)>/i, function (match) {
                 var attributesString = match[2],
                     decodedDirectiveString;
 
diff --git a/lib/web/mage/adminhtml/wysiwyg/events.js b/lib/web/mage/adminhtml/wysiwyg/events.js
@@ -0,0 +1,22 @@
+/**
+ * Copyright © Magento, Inc. All rights reserved.
+ * See COPYING.txt for license details.
+ */
+
+define([], function () {
+    'use strict';
+
+    return {
+        afterInitialization: 'afterInitialization',
+        afterChangeContent: 'afterChangeContent',
+        afterUndo: 'afterUndo',
+        afterPaste: 'afterPaste',
+        beforeSetContent: 'beforeSetContent',
+        afterSetContent: 'afterSetContent',
+        afterSave: 'afterSave',
+        afterOpenFileBrowser: 'afterOpenFileBrowser',
+        afterFormSubmit: 'afterFormSubmit',
+        afterBlur: 'afterBlur',
+        afterFocus: 'afterFocus'
+    };
+});
diff --git a/lib/web/mage/adminhtml/wysiwyg/tiny_mce/plugins/magentowidget/editor_plugin.js b/lib/web/mage/adminhtml/wysiwyg/tiny_mce/plugins/magentowidget/editor_plugin.js
@@ -7,7 +7,8 @@
 /* eslint-disable strict */
 define([
     'wysiwygAdapter',
-    'mage/adminhtml/events'
+    'mage/adminhtml/events',
+    'mage/adminhtml/wysiwyg/widget'
 ], function (wysiwyg, varienGlobalEvents) {
     return function (config) {
         tinymce.create('tinymce.plugins.magentowidget', {
diff --git a/lib/web/mage/adminhtml/wysiwyg/tiny_mce/setup.js b/lib/web/mage/adminhtml/wysiwyg/tiny_mce/setup.js
@@ -8,12 +8,14 @@ define([
     'jquery',
     'underscore',
     'wysiwygAdapter',
+    'module',
     'mage/translate',
     'prototype',
     'mage/adminhtml/events',
     'mage/adminhtml/browser'
-], function (jQuery, _, wysiwygAdapter) {
-    var wysiwygSetup = Class.create({
+], function (jQuery, _, wysiwygAdapter, module) {
+    var baseConfig = module.config().config || {},
+        wysiwygSetup = Class.create({
         wysiwygInstance: null
     });
 
@@ -27,7 +29,10 @@ define([
             var WysiwygInstancePrototype = new wysiwygAdapter.getAdapterPrototype();
 
             _.bindAll(this, 'openFileBrowser');
+
+            config = Object.assign({}, baseConfig, config || {});
             this.wysiwygInstance = new WysiwygInstancePrototype(htmlId, config);
+            this.wysiwygInstance.eventBus = this.eventBus = new window.varienEvents();
         },
 
         /**
@@ -67,6 +72,9 @@ define([
         updateContent: function (content) {
             return this.wysiwygInstance.encodeContent(content);
         }
+
     };
     window.wysiwygSetup = wysiwygSetup;
+
+    return wysiwygSetup;
 });
diff --git a/lib/web/mage/adminhtml/wysiwyg/tiny_mce/themes/ui.css b/lib/web/mage/adminhtml/wysiwyg/tiny_mce/themes/ui.css
@@ -15,6 +15,8 @@
     font-style: normal;
     font-size: 14px;
     color: #000;
+    box-sizing: initial;
+    word-break: break-all;
 }
 
 .magento-placeholder-error {
diff --git a/lib/web/mage/adminhtml/wysiwyg/tiny_mce/tinymce4Adapter.js b/lib/web/mage/adminhtml/wysiwyg/tiny_mce/tinymce4Adapter.js
@@ -10,10 +10,11 @@ define([
     'underscore',
     'tinymce4',
     'mage/adminhtml/events',
+    'mage/adminhtml/wysiwyg/events',
     'mage/translate',
     'prototype',
     'jquery/ui'
-], function (jQuery, _, tinyMCE4, varienGlobalEvents) {
+], function (jQuery, _, tinyMCE4, varienGlobalEvents, wysiwygEvents) {
     'use strict';
 
     var tinyMce4Wysiwyg = Class.create();
@@ -72,10 +73,6 @@ define([
 
             this.turnOff();
 
-            if (typeof mode === 'undefined') {
-                mode = this.mode;
-            }
-
             if (this.config.plugins) {
                 this.config.plugins.forEach(function (plugin) {
                     var deferred;
@@ -105,11 +102,21 @@ define([
             }
 
             settings = this.getSettings();
-            settings.mode = mode;
+
+            if (mode === 'inline') {
+                settings.inline = true;
+
+                if (!isNaN(settings.toolbarZIndex)) {
+                    tinyMCE4.ui.FloatPanel.zIndex = settings.toolbarZIndex;
+                }
+
+                varienGlobalEvents.removeEventHandler('tinymceChange', this.onChangeContent);
+            }
 
             jQuery.when.apply(jQuery, deferreds).done(function () {
                 tinyMCE4.init(settings);
                 this.getPluginButtons().hide();
+                this.eventBus.attachEventHandler('open_browser_callback', this.openFileBrowser);
             }.bind(this));
         },
 
@@ -165,10 +172,11 @@ define([
          * @return {Object}
          */
         getSettings: function () {
-            var settings;
+            var settings,
+                eventBus = this.eventBus;
 
             settings = {
-                selector: 'textarea#' + this.getId(),
+                selector: '#' + this.getId(),
                 theme: 'modern',
                 'entity_encoding': 'raw',
                 'convert_urls': false,
@@ -187,29 +195,43 @@ define([
 
                     editor.on('BeforeSetContent', function (evt) {
                         varienGlobalEvents.fireEvent('tinymceBeforeSetContent', evt);
+                        eventBus.fireEvent(wysiwygEvents.beforeSetContent);
                     });
 
                     editor.on('SaveContent', function (evt) {
                         varienGlobalEvents.fireEvent('tinymceSaveContent', evt);
+                        eventBus.fireEvent(wysiwygEvents.afterSave);
                     });
 
                     editor.on('paste', function (evt) {
                         varienGlobalEvents.fireEvent('tinymcePaste', evt);
+                        eventBus.fireEvent(wysiwygEvents.afterPaste);
                     });
 
                     editor.on('PostProcess', function (evt) {
                         varienGlobalEvents.fireEvent('tinymceSaveContent', evt);
+                        eventBus.fireEvent(wysiwygEvents.afterSave);
                     });
 
                     editor.on('undo', function (evt) {
                         varienGlobalEvents.fireEvent('tinymceUndo', evt);
+                        eventBus.fireEvent(wysiwygEvents.afterUndo);
+                    });
+
+                    editor.on('focus', function () {
+                        eventBus.fireEvent(wysiwygEvents.afterFocus);
+                    });
+
+                    editor.on('blur', function () {
+                        eventBus.fireEvent(wysiwygEvents.afterBlur);
                     });
 
                     /**
                      * @param {*} evt
                      */
                     onChange = function (evt) {
                         varienGlobalEvents.fireEvent('tinymceChange', evt);
+                        eventBus.fireEvent(wysiwygEvents.afterChangeContent);
                     };
 
                     editor.on('Change', onChange);
@@ -221,6 +243,7 @@ define([
 
                     editor.on('init', function (args) {
                         varienGlobalEvents.fireEvent('wysiwygEditorInitialized', args.target);
+                        eventBus.fireEvent(wysiwygEvents.afterInitialization);
                     });
                 }
             };
@@ -241,12 +264,15 @@ define([
                  * @param {*} w
                  */
                 settings['file_browser_callback'] = function (fieldName, url, objectType, w) {
-                    varienGlobalEvents.fireEvent('open_browser_callback', {
+                    var payload = {
                         win: w,
                         type: objectType,
                         field: fieldName
-                    });
-                };
+                    };
+
+                    varienGlobalEvents.fireEvent('open_browser_callback', payload);
+                    this.eventBus.fireEvent('open_browser_callback', payload);
+                }.bind(this);
             }
 
             if (this.config.width) {
@@ -303,6 +329,15 @@ define([
             this.activeEditor().execCommand('mceInsertContent', typeof ui !== 'undefined' ? ui : false, content);
         },
 
+        /**
+         * Replace entire contents of wysiwyg with string content parameter
+         *
+         * @param {String} content
+         */
+        setContent: function (content) {
+            this.get(this.getId()).execCommand('mceSetContent', false, content);
+        },
+
         /**
          * Set caret location in WYSIWYG editor.
          *
@@ -491,7 +526,7 @@ define([
          * @return {String}
          */
         getContent: function (id) {
-            return id ? this.get(id).getContent() : this.activeEditor().getContent();
+            return id ? this.get(id).getContent() : this.get(this.getId()).getContent();
         },
 
         /**
@@ -587,7 +622,7 @@ define([
          */
         encodeDirectives: function (content) {
             // collect all HTML tags with attributes that contain directives
-            return content.gsub(/<([a-z0-9\-\_]+[^>]+?)([a-z0-9\-\_]+=".*?\{\{.+?\}\}.*?".*?)>/i, function (match) {
+            return content.gsub(/<([a-z0-9\-\_]+[^>]+?)([a-z0-9\-\_]+="[^"]*?\{\{.+?\}\}.*?".*?)>/i, function (match) {
                 var attributesString = match[2],
                     decodedDirectiveString;
 
diff --git a/lib/web/mage/adminhtml/wysiwyg/widget.js b/lib/web/mage/adminhtml/wysiwyg/widget.js
@@ -275,7 +275,12 @@ define([
             }
 
             if (e != undefined && e.id) { //eslint-disable-line eqeqeq
-                widgetCode = Base64.idDecode(e.id);
+                // attempt to Base64-decode id on selected node; exception is thrown if it is in fact not a widget node
+                try {
+                    widgetCode = Base64.idDecode(e.id);
+                } catch (ex) {
+                    return false;
+                }
 
                 if (widgetCode.indexOf('{{widget') !== -1) {
                     this.optionValues = new Hash({});
