Theme Gema: Theme conflict with Jetpack Search (upgrade)

[retnonindya]

Quick summary

When a website has these two conditions:

• Theme Gema active, and...
• It has a Jetpack Search subscription active

Jetpack Search will NOT work.

Steps to reproduce

1. Activate theme Gema/ensure theme Gema is ACTIVE on the website (Simple Site)
2. Ensure the website has paid Jetpack Search subscription

Search result when using regular Search widget will yield blank screen. This, though, can be rectified by adding this CSS code:

body {
    opacity: 1;
}

Per this Slack finding: p1631179945095800-slack-C03TY6J1A

Adding "Jetpack Search" (or "Search (powered by Jetpack)") widget will cause Widgets (Block Widgets) throw error ("The editor has encountered an unexpected error") with a "Copy Error" button. This is the error:

TypeError: Cannot read properties of undefined (reading 'get')
    at Oe._createWidget (https://s0.wp.com/wp-content/plugins/gutenberg-core/v11.4.1/build/customize-widgets/index.min.js?m=1630518223h&ver=546484628ba943033ba6605bfed8f168:9:12628)
    at https://s0.wp.com/wp-content/plugins/gutenberg-core/v11.4.1/build/customize-widgets/index.min.js?m=1630518223h&ver=546484628ba943033ba6605bfed8f168:9:13713
    at Array.map (<anonymous>)
    at Oe._updateWidgets (https://s0.wp.com/wp-content/plugins/gutenberg-core/v11.4.1/build/customize-widgets/index.min.js?m=1630518223h&ver=546484628ba943033ba6605bfed8f168:9:13619)
    at Oe.setWidgets (https://s0.wp.com/wp-content/plugins/gutenberg-core/v11.4.1/build/customize-widgets/index.min.js?m=1630518223h&ver=546484628ba943033ba6605bfed8f168:9:13908)
    at https://s0.wp.com/wp-content/plugins/gutenberg-core/v11.4.1/build/customize-widgets/index.min.js?m=1630518223h&ver=546484628ba943033ba6605bfed8f168:9:3067
    at ma (https://s0.wp.com/wp-content/plugins/gutenberg-core/v11.4.1/vendor/react-dom.min.edd8b7a6.js?m=1624062436h:7:8328)
    at lc (https://s0.wp.com/wp-content/plugins/gutenberg-core/v11.4.1/vendor/react-dom.min.edd8b7a6.js?m=1624062436h:7:8781)
    at Object.useState (https://s0.wp.com/wp-content/plugins/gutenberg-core/v11.4.1/vendor/react-dom.min.edd8b7a6.js?m=1624062436h:10:5919)
    at c.useState (https://s0.wp.com/wp-content/plugins/gutenberg-core/v11.4.1/vendor/react.min.755b0ae9.js?m=1624062436h:5:7080)

What you expected to happen

Jetpack Search to work properly, without any blank screen -- and the widget can be added properly

What actually happened

Search result when using regular Search widget will yield blank screen. This, though, can be rectified by adding this CSS code:

body {
    opacity: 1;
}

Per this Slack finding: p1631179945095800-slack-C03TY6J1A

Adding "Jetpack Search" (or "Search (powered by Jetpack)") widget will cause Widgets (Block Widgets) throw error ("The editor has encountered an unexpected error") with a "Copy Error" button. This is the error:

TypeError: Cannot read properties of undefined (reading 'get')
    at Oe._createWidget (https://s0.wp.com/wp-content/plugins/gutenberg-core/v11.4.1/build/customize-widgets/index.min.js?m=1630518223h&ver=546484628ba943033ba6605bfed8f168:9:12628)
    at https://s0.wp.com/wp-content/plugins/gutenberg-core/v11.4.1/build/customize-widgets/index.min.js?m=1630518223h&ver=546484628ba943033ba6605bfed8f168:9:13713
    at Array.map (<anonymous>)
    at Oe._updateWidgets (https://s0.wp.com/wp-content/plugins/gutenberg-core/v11.4.1/build/customize-widgets/index.min.js?m=1630518223h&ver=546484628ba943033ba6605bfed8f168:9:13619)
    at Oe.setWidgets (https://s0.wp.com/wp-content/plugins/gutenberg-core/v11.4.1/build/customize-widgets/index.min.js?m=1630518223h&ver=546484628ba943033ba6605bfed8f168:9:13908)
    at https://s0.wp.com/wp-content/plugins/gutenberg-core/v11.4.1/build/customize-widgets/index.min.js?m=1630518223h&ver=546484628ba943033ba6605bfed8f168:9:3067
    at ma (https://s0.wp.com/wp-content/plugins/gutenberg-core/v11.4.1/vendor/react-dom.min.edd8b7a6.js?m=1624062436h:7:8328)
    at lc (https://s0.wp.com/wp-content/plugins/gutenberg-core/v11.4.1/vendor/react-dom.min.edd8b7a6.js?m=1624062436h:7:8781)
    at Object.useState (https://s0.wp.com/wp-content/plugins/gutenberg-core/v11.4.1/vendor/react-dom.min.edd8b7a6.js?m=1624062436h:10:5919)
    at c.useState (https://s0.wp.com/wp-content/plugins/gutenberg-core/v11.4.1/vendor/react.min.755b0ae9.js?m=1624062436h:5:7080)

Context

I'm picking this up from Slack post (from pit-crew call) and I able to replicate it on my Premium site.

Operating System

Windows, macOS, Linux, Android, iOS

Browser

Google Chrome/Chromium, Mozilla Firefox, Microsoft Edge, Microsoft Edge (legacy), Apple Safari

Simple, Atomic or both?

Simple

Theme-specific issue?

Gema

Other notes

No response

Reproducibility

Consistent

Severity

Most (> 50%)

Available workarounds?

No response

Workaround details

No response

[Robertght]

Same with Rebalance 4325012-zen

The theme has this:

.js body {
    opacity: 0;
}

After using opacity: 1, the search results showed up.

[mrfoxtalbot]

Another instance in 7732120-zen

[github-actions[bot]]

Support References

This comment is automatically generated. Please do not edit it.

• [ ] 4325012-zen
• [ ] 7732120-zen