Skip to content
This repository was archived by the owner on Feb 23, 2024. It is now read-only.

Conversation

@frontdevde
Copy link
Contributor

This PR is a follow-up on one of a couple of small issues we discovered since the recent updates of the featured item blocks (the other issue was fixed in #6499).

This PR aims to resolve a console error that's being thrown when interacting with the Featured Product/Category blocks. The issue occurred in the help text being added in the editor sidebar. It was caused by a block-level element being included in a <p> element, which must only contain inline containers.

Screenshots

Screenshot 2022-05-31 at 15 45 53

Screenshot 2022-05-31 at 14 28 01

Testing

  1. Create a new page and add a Featured Product or a Featured Category block and open the console.
  2. Click on the added block, edit some settings and check the error shown on the screenshot above does not appear.

@frontdevde frontdevde added the skip-changelog PRs that you don't want to appear in the changelog. label May 31, 2022
@rubikuserbot rubikuserbot requested a review from a team May 31, 2022 13:51
@github-actions
Copy link
Contributor

Size Change: +50 B (0%)

Total Size: 862 kB

Filename Size Change
build/featured-category.js 13.2 kB +26 B (0%)
build/featured-product.js 13.5 kB +24 B (0%)
ℹ️ View Unchanged
Filename Size
build/active-filters-frontend.js 6.59 kB
build/active-filters.js 7.43 kB
build/all-products-frontend.js 18.1 kB
build/all-products.js 33.5 kB
build/all-reviews.js 7.79 kB
build/attribute-filter-frontend.js 17.7 kB
build/attribute-filter.js 13.8 kB
build/blocks-checkout.js 17.4 kB
build/cart-blocks/cart-accepted-payment-methods-frontend.js 1.16 kB
build/cart-blocks/cart-express-payment-frontend.js 5.06 kB
build/cart-blocks/cart-items-frontend.js 299 B
build/cart-blocks/cart-line-items--mini-cart-contents-block/products-table-frontend.js 5.27 kB
build/cart-blocks/cart-line-items-frontend.js 432 B
build/cart-blocks/cart-order-summary-frontend.js 1.11 kB
build/cart-blocks/cart-totals-frontend.js 322 B
build/cart-blocks/empty-cart-frontend.js 346 B
build/cart-blocks/filled-cart-frontend.js 782 B
build/cart-blocks/order-summary-coupon-form-frontend.js 2.62 kB
build/cart-blocks/order-summary-discount-frontend.js 2.13 kB
build/cart-blocks/order-summary-fee-frontend.js 273 B
build/cart-blocks/order-summary-heading-frontend.js 454 B
build/cart-blocks/order-summary-shipping--checkout-blocks/order-summary-shipping-frontend.js 6.34 kB
build/cart-blocks/order-summary-shipping-frontend.js 428 B
build/cart-blocks/order-summary-subtotal-frontend.js 273 B
build/cart-blocks/order-summary-taxes-frontend.js 433 B
build/cart-blocks/proceed-to-checkout-frontend.js 1.15 kB
build/cart-frontend.js 45.3 kB
build/cart.js 44.1 kB
build/checkout-blocks/actions-frontend.js 1.41 kB
build/checkout-blocks/billing-address--checkout-blocks/shipping-address-frontend.js 4.12 kB
build/checkout-blocks/billing-address-frontend.js 892 B
build/checkout-blocks/contact-information-frontend.js 2.83 kB
build/checkout-blocks/express-payment-frontend.js 5.35 kB
build/checkout-blocks/fields-frontend.js 345 B
build/checkout-blocks/order-note-frontend.js 1.07 kB
build/checkout-blocks/order-summary-cart-items-frontend.js 3.66 kB
build/checkout-blocks/order-summary-coupon-form-frontend.js 2.78 kB
build/checkout-blocks/order-summary-discount-frontend.js 2.25 kB
build/checkout-blocks/order-summary-fee-frontend.js 275 B
build/checkout-blocks/order-summary-frontend.js 1.11 kB
build/checkout-blocks/order-summary-shipping-frontend.js 603 B
build/checkout-blocks/order-summary-subtotal-frontend.js 273 B
build/checkout-blocks/order-summary-taxes-frontend.js 432 B
build/checkout-blocks/payment-frontend.js 7.67 kB
build/checkout-blocks/shipping-address-frontend.js 997 B
build/checkout-blocks/shipping-methods-frontend.js 4.71 kB
build/checkout-blocks/terms-frontend.js 1.22 kB
build/checkout-blocks/totals-frontend.js 326 B
build/checkout-frontend.js 47.5 kB
build/checkout.js 45.4 kB
build/handpicked-products.js 7.39 kB
build/legacy-template.js 2.2 kB
build/mini-cart-component-frontend.js 16.6 kB
build/mini-cart-contents-block/empty-cart-frontend.js 364 B
build/mini-cart-contents-block/filled-cart-frontend.js 230 B
build/mini-cart-contents-block/footer--mini-cart-contents-block/products-table-frontend.js 4.69 kB
build/mini-cart-contents-block/footer-frontend.js 5.63 kB
build/mini-cart-contents-block/items-frontend.js 225 B
build/mini-cart-contents-block/products-table-frontend.js 289 B
build/mini-cart-contents-block/shopping-button-frontend.js 287 B
build/mini-cart-contents-block/title-frontend.js 366 B
build/mini-cart-contents.js 22.8 kB
build/mini-cart-frontend.js 1.72 kB
build/mini-cart.js 6.62 kB
build/price-filter-frontend.js 12.5 kB
build/price-filter.js 8.74 kB
build/price-format.js 1.19 kB
build/product-add-to-cart--product-button--product-category-list--product-image--product-price--product-r--a0326d00.js 223 B
build/product-add-to-cart--product-button--product-image--product-title.js 2.65 kB
build/product-add-to-cart--product-button.js 564 B
build/product-add-to-cart-frontend.js 6.96 kB
build/product-add-to-cart.js 6.64 kB
build/product-best-sellers.js 7.47 kB
build/product-button--product-category-list--product-image--product-price--product-rating--product-sale-b--e17c7c01.js 500 B
build/product-button-frontend.js 1.85 kB
build/product-button.js 1.09 kB
build/product-categories.js 2.78 kB
build/product-category-list-frontend.js 923 B
build/product-category-list.js 501 B
build/product-category.js 8.58 kB
build/product-image-frontend.js 1.84 kB
build/product-image.js 1.07 kB
build/product-new.js 7.76 kB
build/product-on-sale.js 8.08 kB
build/product-price-frontend.js 1.94 kB
build/product-price.js 1.5 kB
build/product-rating-frontend.js 1.15 kB
build/product-rating.js 735 B
build/product-sale-badge-frontend.js 1.09 kB
build/product-sale-badge.js 679 B
build/product-search.js 2.18 kB
build/product-sku-frontend.js 380 B
build/product-sku.js 381 B
build/product-stock-indicator-frontend.js 1.03 kB
build/product-stock-indicator.js 621 B
build/product-summary-frontend.js 1.33 kB
build/product-summary.js 916 B
build/product-tag-list-frontend.js 917 B
build/product-tag-list.js 495 B
build/product-tag.js 8.12 kB
build/product-title-frontend.js 1.3 kB
build/product-title.js 909 B
build/product-top-rated.js 8 kB
build/products-by-attribute.js 8.69 kB
build/reviews-by-category.js 11.3 kB
build/reviews-by-product.js 12.4 kB
build/reviews-frontend.js 7.02 kB
build/single-product-frontend.js 21.5 kB
build/single-product.js 10.1 kB
build/stock-filter-frontend.js 6.87 kB
build/stock-filter.js 6.95 kB
build/vendors--cart-blocks/cart-line-items--cart-blocks/cart-order-summary--cart-blocks/order-summary-shi--c02aad66-frontend.js 5.26 kB
build/vendors--cart-blocks/cart-line-items--checkout-blocks/order-summary-cart-items--mini-cart-contents---233ab542-frontend.js 3.14 kB
build/vendors--cart-blocks/order-summary-shipping--checkout-blocks/billing-address--checkout-blocks/order--5b8feb0b-frontend.js 4.72 kB
build/vendors--cart-blocks/order-summary-shipping--checkout-blocks/billing-address--checkout-blocks/order--decc3dc6-frontend.js 20.5 kB
build/vendors--mini-cart-contents-block/footer-frontend.js 6.86 kB
build/vendors--product-add-to-cart-frontend.js 7.53 kB
build/wc-blocks-data.js 9.87 kB
build/wc-blocks-editor-style-rtl.css 5.04 kB
build/wc-blocks-editor-style.css 5.04 kB
build/wc-blocks-google-analytics.js 1.56 kB
build/wc-blocks-middleware.js 930 B
build/wc-blocks-registry.js 2.7 kB
build/wc-blocks-shared-context.js 1.52 kB
build/wc-blocks-shared-hocs.js 1.14 kB
build/wc-blocks-style-rtl.css 22.2 kB
build/wc-blocks-style.css 22.1 kB
build/wc-blocks-vendors-style-rtl.css 1.28 kB
build/wc-blocks-vendors-style.css 1.28 kB
build/wc-blocks-vendors.js 59 kB
build/wc-blocks.js 2.63 kB
build/wc-payment-method-bacs.js 816 B
build/wc-payment-method-cheque.js 811 B
build/wc-payment-method-cod.js 909 B
build/wc-payment-method-paypal.js 837 B
build/wc-settings.js 2.61 kB

compressed-size-action

@frontdevde frontdevde removed the request for review from a team May 31, 2022 14:56
Copy link
Contributor

@sunyatasattva sunyatasattva left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for spotting this! I wonder why I couldn't reproduce and how come we didn't notice earlier, as this change was introduced at the beginning of the project.

But thanks for the fix. I'm more a fan of giving these spans a className (like help-text or something) and styling them through CSS, but I don't have a strong stance on this, so I'm approving.

@github-actions github-actions bot added this to the 7.8.0 milestone May 31, 2022
@frontdevde
Copy link
Contributor Author

I'm more a fan of giving these spans a className (like help-text or something) and styling them through CSS, but I don't have a strong stance on this, so I'm approving.

Usually, I'd 100% agree. This is in the editor sidebar though. I'd argue we'd want to keep the styling surface to an absolute minimum there and providing an additional class that folks could attach more styles to could be a precedent we don't want.

@frontdevde frontdevde merged commit 661d0e2 into trunk Jun 1, 2022
@frontdevde frontdevde deleted the update/featured-item-inspector-controls-valid-dom branch June 1, 2022 08:02
@gigitux gigitux added the type: bug The issue/PR concerns a confirmed bug. label Jun 6, 2022
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Labels

skip-changelog PRs that you don't want to appear in the changelog. type: bug The issue/PR concerns a confirmed bug.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants