Merge branch 'develop' into customizer/global-settings

Author: Mario Aguiar

bin/phpunit-theme.sh

@@ -0,0 +1,17 @@
+#!/bin/bash
+# Copyright 2020 Google LLC
+#
+# Licensed under the Apache License, Version 2.0 (the "License");
+# you may not use this file except in compliance with the License.
+# You may obtain a copy of the License at
+#
+#      http://www.apache.org/licenses/LICENSE-2.0
+#
+# Unless required by applicable law or agreed to in writing, software
+# distributed under the License is distributed on an "AS IS" BASIS,
+# WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+# See the License for the specific language governing permissions and
+# limitations under the License.
+
+
+docker-compose run --rm -u 1000 --workdir=/var/www/html/wp-content/themes/material-design-google wordpress -- composer test

package-lock.json

@@ -64,11 +64,14 @@
     "@wordpress/dom": "2.8.0",
     "@wordpress/dom-ready": "2.8.0",
     "@wordpress/e2e-test-utils": "4.16.0",
+    "@wordpress/edit-post": "^4.1.0",
+    "@wordpress/element": "^3.1.0",
     "@wordpress/escape-html": "1.11.0",
     "@wordpress/eslint-plugin": "4.1.0",
     "@wordpress/i18n": "3.10.0",
     "@wordpress/jest-preset-default": "5.5.0",
     "@wordpress/jest-puppeteer-axe": "1.6.0",
+    "@wordpress/plugins": "^3.1.0",
     "@wordpress/postcss-themes": "2.3.0",
     "@wordpress/rich-text": "3.24.1",
     "@wordpress/scripts": "12.6.1",

package.json

@@ -3,7 +3,7 @@
  * Plugin Name: Material Design
  * Plugin URI: https://github.com/material-components/material-design-for-wordpress
  * Description: The official Material Design plugin for WordPress. Customize your site’s navigation, colors, typography, and shapes, use Material Components, and choose from over 1,000 Google Fonts and Material Design icons. From the team behind Google’s open-source design system.
- * Version: 0.2.0
+ * Version: 0.3.0
  * Author:  Material Design
  * Author URI: http://material.io
  * License: Apache License, Version 2.0

plugin/assets/fonts/icons.json

@@ -29,7 +29,7 @@
 
 return [
 	'title'         => __( 'Logos', 'material-design' ),
-	'content'       => "<!-- wp:columns -->\n<div class=\"wp-block-columns\"><!-- wp:column -->\n<div class=\"wp-block-column\"><!-- wp:image -->\n<figure class=\"wp-block-image size-large\"><img src=\"$logo\" alt=\"\" /></figure>\n<!-- /wp:image --></div>\n<!-- /wp:column -->\n<!-- wp:column -->\n<div class=\"wp-block-column\"><!-- wp:image -->\n<figure class=\"wp-block-image size-large\"><img src=\"$logo\" alt=\"\"/></figure>\n<!-- /wp:image --></div>\n<!-- /wp:column -->\n<!-- wp:column -->\n<div class=\"wp-block-column\"><!-- wp:image -->\n<figure class=\"wp-block-image size-large\"><img src=\"$logo\" alt=\"\"/></figure>\n<!-- /wp:image --></div>\n<!-- /wp:column -->\n<!-- wp:column -->\n<div class=\"wp-block-column\"><!-- wp:image -->\n<figure class=\"wp-block-image size-large\"><img src=\"$logo\" alt=\"\"/></figure>\n<!-- /wp:image --></div>\n<!-- /wp:column -->\n<!-- wp:column -->\n<div class=\"wp-block-column\"><!-- wp:image -->\n<figure class=\"wp-block-image size-large\"><img src=\"$logo\" alt=\"\"/></figure>\n<!-- /wp:image --></div>\n<!-- /wp:column -->\n<!-- wp:column -->\n<div class=\"wp-block-column\"><!-- wp:image -->\n<figure class=\"wp-block-image size-large\"><img src=\"$logo\" alt=\"\"/></figure>\n<!-- /wp:image --></div>\n<!-- /wp:column --></div>\n<!-- /wp:columns -->",
+	'content'       => "<!-- wp:group {\"align\":\"wide\"} -->\n<div class=\"wp-block-group alignwide\"><div class=\"wp-block-group__inner-container\"><!-- wp:heading {\"textAlign\":\"center\",\"level\":4} -->\n<h4 class=\"has-text-align-center\">Trusted by our beloved clients</h4>\n<!-- /wp:heading -->\n\n<!-- wp:columns {\"align\":\"wide\"} -->\n<div class=\"wp-block-columns alignwide\"><!-- wp:column -->\n<div class=\"wp-block-column\"><!-- wp:image {\"className\":\"size-large is-style-default\"} -->\n<figure class=\"wp-block-image size-large is-style-default\"><img src=\"http://localhost:8088/wp-content/plugins/material-design/assets/images/logo-place-holder.png\" alt=\"\"/></figure>\n<!-- /wp:image --></div>\n<!-- /wp:column -->\n\n<!-- wp:column -->\n<div class=\"wp-block-column\"><!-- wp:image {\"className\":\"size-large\"} -->\n<figure class=\"wp-block-image size-large\"><img src=\"http://localhost:8088/wp-content/plugins/material-design/assets/images/logo-place-holder.png\" alt=\"\"/></figure>\n<!-- /wp:image --></div>\n<!-- /wp:column -->\n\n<!-- wp:column -->\n<div class=\"wp-block-column\"><!-- wp:image {\"className\":\"size-large\"} -->\n<figure class=\"wp-block-image size-large\"><img src=\"http://localhost:8088/wp-content/plugins/material-design/assets/images/logo-place-holder.png\" alt=\"\"/></figure>\n<!-- /wp:image --></div>\n<!-- /wp:column -->\n\n<!-- wp:column -->\n<div class=\"wp-block-column\"><!-- wp:image {\"className\":\"size-large\"} -->\n<figure class=\"wp-block-image size-large\"><img src=\"http://localhost:8088/wp-content/plugins/material-design/assets/images/logo-place-holder.png\" alt=\"\"/></figure>\n<!-- /wp:image --></div>\n<!-- /wp:column -->\n\n<!-- wp:column -->\n<div class=\"wp-block-column\"><!-- wp:image {\"className\":\"size-large\"} -->\n<figure class=\"wp-block-image size-large\"><img src=\"http://localhost:8088/wp-content/plugins/material-design/assets/images/logo-place-holder.png\" alt=\"\"/></figure>\n<!-- /wp:image --></div>\n<!-- /wp:column -->\n\n<!-- wp:column -->\n<div class=\"wp-block-column\"><!-- wp:image {\"className\":\"size-large\"} -->\n<figure class=\"wp-block-image size-large\"><img src=\"http://localhost:8088/wp-content/plugins/material-design/assets/images/logo-place-holder.png\" alt=\"\"/></figure>\n<!-- /wp:image --></div>\n<!-- /wp:column --></div>\n<!-- /wp:columns --></div></div>\n<!-- /wp:group -->",
 	'viewportWidth' => 800,
 	'categories'    => [ 'material' ],
 	'description'   => __( 'Logos pattern.', 'material-design' ),

plugin/material-design.php

@@ -25,7 +25,7 @@
 
 return [
 	'title'         => __( 'Pricing', 'material-design' ),
-	'content'       => "<!-- wp:group -->\n<div class=\"wp-block-group\"><div class=\"wp-block-group__inner-container\"><!-- wp:heading {\"textAlign\":\"center\",\"level\":4} -->\n<h4 class=\"has-text-align-center\">Pricing</h4>\n<!-- /wp:heading -->\n\n<!-- wp:paragraph {\"align\":\"center\"} -->\n<p class=\"has-text-align-center\">Perform this action in no time, Satisfaction guaranteed.</p>\n<!-- /wp:paragraph -->\n\n<!-- wp:columns -->\n<div class=\"wp-block-columns\"><!-- wp:column {\"width\":\"\"} -->\n<div class=\"wp-block-column\"><!-- wp:heading {\"textAlign\":\"center\",\"level\":5} -->\n<h5 class=\"has-text-align-center\">Price title</h5>\n<!-- /wp:heading -->\n\n<!-- wp:paragraph {\"align\":\"center\"} -->\n<p class=\"has-text-align-center\">Price Subtitle Description.</p>\n<!-- /wp:paragraph -->\n\n<!-- wp:paragraph {\"align\":\"center\",\"style\":{\"color\":{\"background\":\"#f0f0f0\"},\"typography\":{\"fontSize\":26}}} -->\n<p class=\"has-text-align-center has-background\" style=\"background-color:#f0f0f0;font-size:26px\">$ 9.99 / mo</p>\n<!-- /wp:paragraph -->\n\n<!-- wp:paragraph {\"align\":\"center\"} -->\n<p class=\"has-text-align-center\">First feature included<br>Second feature included<br>Third feature included<br>Fourth feature included<br>Fifth feature included</p>\n<!-- /wp:paragraph -->\n\n<!-- wp:material/buttons {\"align\":\"center\"} -->\n<div class=\"wp-block-material-buttons aligncenter\"><!-- wp:material/button {\"iconPosition\":\"none\"} -->\n<div class=\"wp-block-material-button\" id=\"block-material-button-0\"><button class=\"mdc-button mdc-button--raised\"><div class=\"mdc-button__ripple\"></div><span class=\"mdc-button__label\">But now</span></button></div>\n<!-- /wp:material/button --></div>\n<!-- /wp:material/buttons --></div>\n<!-- /wp:column -->\n\n<!-- wp:column -->\n<div class=\"wp-block-column\"><!-- wp:heading {\"textAlign\":\"center\",\"level\":5} -->\n<h5 class=\"has-text-align-center\">Price title</h5>\n<!-- /wp:heading -->\n\n<!-- wp:paragraph {\"align\":\"center\"} -->\n<p class=\"has-text-align-center\">Price Subtitle Description.</p>\n<!-- /wp:paragraph -->\n\n<!-- wp:paragraph {\"align\":\"center\",\"style\":{\"typography\":{\"fontSize\":26},\"color\":{\"background\":\"#f0f0f0\"}}} -->\n<p class=\"has-text-align-center has-background\" style=\"background-color:#f0f0f0;font-size:26px\">$ 9.99 / mo</p>\n<!-- /wp:paragraph -->\n\n<!-- wp:paragraph {\"align\":\"center\"} -->\n<p class=\"has-text-align-center\">First feature included<br>Second feature included<br>Third feature included<br>Fourth feature included<br>Fifth feature included</p>\n<!-- /wp:paragraph -->\n\n<!-- wp:material/buttons {\"align\":\"center\"} -->\n<div class=\"wp-block-material-buttons aligncenter\"><!-- wp:material/button {\"iconPosition\":\"none\"} -->\n<div class=\"wp-block-material-button\" id=\"block-material-button-0\"><button class=\"mdc-button mdc-button--raised\"><div class=\"mdc-button__ripple\"></div><span class=\"mdc-button__label\">But now</span></button></div>\n<!-- /wp:material/button --></div>\n<!-- /wp:material/buttons --></div>\n<!-- /wp:column --></div>\n<!-- /wp:columns --></div></div>\n<!-- /wp:group -->", // phpcs:ignore WordPressVIPMinimum.Security.Mustache.OutputNotation
+	'content'       => "<!-- wp:group -->\n<div class=\"wp-block-group\"><div class=\"wp-block-group__inner-container\"><!-- wp:heading {\"textAlign\":\"center\",\"level\":4} -->\n<h4 class=\"has-text-align-center\">Pricing</h4>\n<!-- /wp:heading -->\n\n<!-- wp:paragraph {\"align\":\"center\"} -->\n<p class=\"has-text-align-center\">Perform this action in no time, Satisfaction guaranteed.</p>\n<!-- /wp:paragraph -->\n\n<!-- wp:columns -->\n<div class=\"wp-block-columns\"><!-- wp:column {\"width\":\"\"} -->\n<div class=\"wp-block-column\"><!-- wp:heading {\"textAlign\":\"center\",\"level\":5} -->\n<h5 class=\"has-text-align-center\">Price title</h5>\n<!-- /wp:heading -->\n\n<!-- wp:paragraph {\"align\":\"center\"} -->\n<p class=\"has-text-align-center\">Price Subtitle Description.</p>\n<!-- /wp:paragraph -->\n\n<!-- wp:paragraph {\"align\":\"center\",\"style\":{\"color\":{\"background\":\"#f0f0f0\"},\"typography\":{\"fontSize\":26}}} -->\n<p class=\"has-text-align-center has-background\" style=\"background-color:#f0f0f0;font-size:26px\">$ 9.99 / mo</p>\n<!-- /wp:paragraph -->\n\n<!-- wp:paragraph {\"align\":\"center\"} -->\n<p class=\"has-text-align-center\">First feature included<br>Second feature included<br>Third feature included<br>Fourth feature included<br>Fifth feature included</p>\n<!-- /wp:paragraph -->\n\n<!-- wp:material/buttons {\"align\":\"center\"} -->\n<div class=\"wp-block-material-buttons aligncenter\"><!-- wp:material/button {\"iconPosition\":\"none\"} -->\n<div class=\"wp-block-material-button\" id=\"block-material-button-0\"><button class=\"mdc-button mdc-button--raised\"><div class=\"mdc-button__ripple\"></div><span class=\"mdc-button__label\">Buy now</span></button></div>\n<!-- /wp:material/button --></div>\n<!-- /wp:material/buttons --></div>\n<!-- /wp:column -->\n\n<!-- wp:column -->\n<div class=\"wp-block-column\"><!-- wp:heading {\"textAlign\":\"center\",\"level\":5} -->\n<h5 class=\"has-text-align-center\">Price title</h5>\n<!-- /wp:heading -->\n\n<!-- wp:paragraph {\"align\":\"center\"} -->\n<p class=\"has-text-align-center\">Price Subtitle Description.</p>\n<!-- /wp:paragraph -->\n\n<!-- wp:paragraph {\"align\":\"center\",\"style\":{\"typography\":{\"fontSize\":26},\"color\":{\"background\":\"#f0f0f0\"}}} -->\n<p class=\"has-text-align-center has-background\" style=\"background-color:#f0f0f0;font-size:26px\">$ 9.99 / mo</p>\n<!-- /wp:paragraph -->\n\n<!-- wp:paragraph {\"align\":\"center\"} -->\n<p class=\"has-text-align-center\">First feature included<br>Second feature included<br>Third feature included<br>Fourth feature included<br>Fifth feature included</p>\n<!-- /wp:paragraph -->\n\n<!-- wp:material/buttons {\"align\":\"center\"} -->\n<div class=\"wp-block-material-buttons aligncenter\"><!-- wp:material/button {\"iconPosition\":\"none\"} -->\n<div class=\"wp-block-material-button\" id=\"block-material-button-0\"><button class=\"mdc-button mdc-button--raised\"><div class=\"mdc-button__ripple\"></div><span class=\"mdc-button__label\">Buy now</span></button></div>\n<!-- /wp:material/button --></div>\n<!-- /wp:material/buttons --></div>\n<!-- /wp:column --></div>\n<!-- /wp:columns --></div></div>\n<!-- /wp:group -->", // phpcs:ignore WordPressVIPMinimum.Security.Mustache.OutputNotation
 	'viewportWidth' => 800,
 	'categories'    => [ 'material' ],
 	'description'   => __( 'Pricing pattern with 2 product description.', 'material-design' ),

plugin/php/block-patterns/logos.php

@@ -1,14 +1,15 @@
+
 <!-- DO NOT EDIT THIS FILE; it is auto-generated from readme.txt -->
 # Material Design for WordPress
 
 ![Banner](wp-assets/banner-1544x500.png)
 The official Material Design plugin for WordPress. Customize your site’s navigation, colors, typography, and shapes, use Material Components, and choose from over 1,000 Google Fonts and Material Design icons. From the team behind Google’s open-source design system.
 
-**Contributors:** [google](https://profiles.wordpress.org/google), [materialdesign](https://profiles.wordpress.org/materialdesign), [xwp](https://profiles.wordpress.org/xwp)  
-**Requires at least:** 5.2  
-**Tested up to:** 5.7  
-**Stable tag:** 0.2.0  
-**License:** [Apache License, Version 2.0](https://www.apache.org/licenses/LICENSE-2.0)  
+**Contributors:** [google](https://profiles.wordpress.org/google), [materialdesign](https://profiles.wordpress.org/materialdesign), [xwp](https://profiles.wordpress.org/xwp)
+**Requires at least:** 5.2
+**Tested up to:** 5.7.2
+**Stable tag:** 0.3.0
+**License:** [Apache License, Version 2.0](https://www.apache.org/licenses/LICENSE-2.0)
 
 ## Description ##
 

plugin/php/block-patterns/pricing.php

@@ -1,8 +1,8 @@
 === Material Design for WordPress ===
 Contributors: google, materialdesign, xwp
 Requires at least: 5.2
-Tested up to: 5.7
-Stable tag: 0.2.0
+Tested up to: 5.7.2
+Stable tag: 0.3.0
 License: Apache License, Version 2.0
 License URI: https://www.apache.org/licenses/LICENSE-2.0
 

plugin/readme.md

@@ -164,7 +164,7 @@ describe( 'EditWithSelect', () => {
 	} );
 
 	it( 'set the correct arguments when the block is the "Hand-picked posts"', () => {
-		const lodash = require.requireActual( 'lodash' );
+		const lodash = jest.requireActual( 'lodash' );
 		jest.spyOn( lodash, 'pickBy' ).mockImplementation( () => 1 );
 
 		const props = {
@@ -186,7 +186,7 @@ describe( 'EditWithSelect', () => {
 	} );
 
 	it( 'set the correct arguments when the block is the "Hand-picked posts" and title ordering', () => {
-		const lodash = require.requireActual( 'lodash' );
+		const lodash = jest.requireActual( 'lodash' );
 		jest.spyOn( lodash, 'pickBy' ).mockImplementation( () => 1 );
 
 		const props = {
@@ -212,7 +212,7 @@ describe( 'EditWithSelect', () => {
 	} );
 
 	it( 'set the correct arguments when the block is the "Hand-picked posts" and popularity ordering', () => {
-		const lodash = require.requireActual( 'lodash' );
+		const lodash = jest.requireActual( 'lodash' );
 		jest.spyOn( lodash, 'pickBy' ).mockImplementation( () => 1 );
 
 		const props = {