[BUG] 🐛 white screen on installing on typo3v12.4.11

[rblezer]

white screen on installing extension builder onto website via composer.

TYPO3 Version 12.4.11
Extension builder v12.0.0-beta.1

[DavidBruchmann]

Error messages from the browser console would certainly be interesting.

[rblezer]

Hi David, Thanks for the quick response, this is the console output: This page uses the non standard property “zoom”. Consider using calc() in the relevant property values, or using “transform” along with “transform-origin: 0 0”. main<http://landingpage.local/typo3/main?token=5ac9b0a3d18e6c9347e925bbe07644ddb4c48557> Successfully compiled asm.js code (total compilation time 2ms) es-module-shims.js<http://landingpage.local/_assets/1ee1d3e909b58d32e30dcea666dd3224/JavaScript/Contrib/es-module-shims.js> This page uses the non standard property “zoom”. Consider using calc() in the relevant property values, or using “transform” along with “transform-origin: 0 0”. extensionBuilder<http://landingpage.local/typo3/module/tools/extensionBuilder?token=fbc8e770af8fd0efa1529e8d6a258b52a070ab1c> Successfully compiled asm.js code (total compilation time 3ms) es-module-shims.js<http://landingpage.local/_assets/1ee1d3e909b58d32e30dcea666dd3224/JavaScript/Contrib/es-module-shims.js> Content-Security-Policy: The page’s settings blocked the loading of a resource at eval (“script-src”). main.js:557<http://landingpage.local/_assets/705f31da96f0870eac9db412ee92df1f/JavaScript/main.js?bust=cdfd7a8e1874e28dd032c511f51447eac22b8bcd> Uncaught (in promise) EvalError: call to eval() blocked by CSP js http://landingpage.local/_assets/705f31da96f0870eac9db412ee92df1f/JavaScript/main.js?bust=cdfd7a8e1874e28dd032c511f51447eac22b8bcd:557 __webpack_require__ http://landingpage.local/_assets/705f31da96f0870eac9db412ee92df1f/JavaScript/main.js?bust=cdfd7a8e1874e28dd032c511f51447eac22b8bcd:3229 <anonymous> http://landingpage.local/_assets/705f31da96f0870eac9db412ee92df1f/JavaScript/main.js?bust=cdfd7a8e1874e28dd032c511f51447eac22b8bcd:3500 <anonymous> http://landingpage.local/_assets/705f31da96f0870eac9db412ee92df1f/JavaScript/main.js?bust=cdfd7a8e1874e28dd032c511f51447eac22b8bcd:3503 webpackUniversalModuleDefinition http://landingpage.local/_assets/705f31da96f0870eac9db412ee92df1f/JavaScript/main.js?bust=cdfd7a8e1874e28dd032c511f51447eac22b8bcd:15 <anonymous> http://landingpage.local/_assets/705f31da96f0870eac9db412ee92df1f/JavaScript/main.js?bust=cdfd7a8e1874e28dd032c511f51447eac22b8bcd:18 main.js:557:1<http://landingpage.local/_assets/705f31da96f0870eac9db412ee92df1f/JavaScript/main.js?bust=cdfd7a8e1874e28dd032c511f51447eac22b8bcd> Hello from extensionbuilder.js extensionbuilder.js:1:9<http://landingpage.local/_assets/705f31da96f0870eac9db412ee92df1f/JavaScript/extensionbuilder.js?bust=cdfd7a8e1874e28dd032c511f51447eac22b8bcd> Uncaught (in promise) TypeError: slackButton is null <anonymous> http://landingpage.local/_assets/705f31da96f0870eac9db412ee92df1f/JavaScript/extensionbuilder.js?bust=cdfd7a8e1874e28dd032c511f51447eac22b8bcd:118 extensionbuilder.js:118:1<http://landingpage.local/_assets/705f31da96f0870eac9db412ee92df1f/JavaScript/extensionbuilder.js?bust=cdfd7a8e1874e28dd032c511f51447eac22b8bcd> [X]

…

________________________________ From: David Bruchmann ***@***.***> Sent: Tuesday, March 5, 2024 06:09 To: FriendsOfTYPO3/extension_builder ***@***.***> Cc: Richard Blezer ***@***.***>; Author ***@***.***> Subject: Re: [FriendsOfTYPO3/extension_builder] white screen on installing on typo3v12.4.11 (Issue #734) Error messages from the browser console would certainly be interesting. — Reply to this email directly, view it on GitHub<#734 (comment)>, or unsubscribe<https://github.com/notifications/unsubscribe-auth/ABOS4S2TESKP7OXSQS2JU7LYWXGYJAVCNFSM6AAAAABEHGTXKKVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMYTSNZYHA2TIOBWHE>. You are receiving this because you authored the thread.Message ID: ***@***.***>

[PKuhlmay]

Thanks, I will have a look at it. Do you have some more information? PHP Version, Composer mode?, Production or Development Mode? Content Security Policy enabled or disabled?
The error looks like a JavaScript error but these information could help me with debugging the error as I don't get this one.

[rblezer]

It's a development site at a local VM, so it's a nonproduction site. As I am battling for weeks to get a simple form to work, with hidden fields which contain data form tt_content, I thought I give content builder a try. The content elements with DCE are quite a Succes. In Joomla it would be ready in hours. anyway: PHP version 8.3.3 Composer version 2.5.1 Content Security Policy The following features flags are currently disabled and won't be shown in this module: * security.frontend.enforceContentSecurityPolicy no entries available

…

________________________________ From: Philipp Kuhlmay ***@***.***> Sent: Tuesday, March 5, 2024 06:16 To: FriendsOfTYPO3/extension_builder ***@***.***> Cc: Richard Blezer ***@***.***>; Author ***@***.***> Subject: Re: [FriendsOfTYPO3/extension_builder] white screen on installing on typo3v12.4.11 (Issue #734) Thanks, I will have a look at it. Do you have some more information? PHP Version, Composer mode?, Production or Development Mode? Content Security Policy enabled or disabled? The error looks like a JavaScript error but these information could help me with debugging the error as I don't get this one. — Reply to this email directly, view it on GitHub<#734 (comment)>, or unsubscribe<https://github.com/notifications/unsubscribe-auth/ABOS4S4KWJD64MJGC2O6BCLYWXHSLAVCNFSM6AAAAABEHGTXKKVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMYTSNZYHA3TGMJTGU>. You are receiving this because you authored the thread.

[PKuhlmay]

This could be because of the content security policy. Could you try to disable it for the backend? In the Admin-Settings under Settings -> Feature Toggle.
I get a blank screen, when I enable the CSP, too. But the errors are a little bit different.

[rblezer]

I'll try that tomorrow, when I'm back in the office.Thanks allot. -------- Oorspronkelijk bericht --------Van: Philipp Kuhlmay ***@***.***> Datum: 05-03-2024 16:55 (GMT+01:00) Aan: FriendsOfTYPO3/extension_builder ***@***.***> Cc: Richard Blezer ***@***.***>, Author ***@***.***> Onderwerp: Re: [FriendsOfTYPO3/extension_builder] white screen on installing on typo3v12.4.11 (Issue #734) This could be because of the content security policy. Could you try to disable it for the backend? In the Admin-Settings under Settings -> Feature Toggle. I get a blank screen, when I enable the CSP, too. But the errors are a little bit different. —Reply to this email directly, view it on GitHub, or unsubscribe.You are receiving this because you authored the thread.Message ID: ***@***.***>

[rblezer]

Yes Succes, when this setting is enabled, page turns blank. Security: backend enforce content security policy Iif on, HTTP Content-Security-Policy header will be applied for each HTTP backend request. Default setting: Disabled

…

________________________________ Van: Philipp Kuhlmay ***@***.***> Verzonden: dinsdag 5 maart 2024 16:55 Aan: FriendsOfTYPO3/extension_builder ***@***.***> CC: Richard Blezer ***@***.***>; Author ***@***.***> Onderwerp: Re: [FriendsOfTYPO3/extension_builder] white screen on installing on typo3v12.4.11 (Issue #734) This could be because of the content security policy. Could you try to disable it for the backend? In the Admin-Settings under Settings -> Feature Toggle. I get a blank screen, when I enable the CSP, too. But the errors are a little bit different. — Reply to this email directly, view it on GitHub<#734 (comment)>, or unsubscribe<https://github.com/notifications/unsubscribe-auth/ABOS4S2NOFH53G25KN6GQK3YWXTFNAVCNFSM6AAAAABEHGTXKKVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMYTSNZZGA4TEOBVHE>. You are receiving this because you authored the thread.Message ID: ***@***.***>

[PKuhlmay]

Thanks for testing. The extension builder should also work, when content security policy is enabled. I think the problem occurs, when I use the wrong command for building all the JS assets with Webpack.

When I compile all the assets in Development mode, it fails, when I compile them in Production mode, it works.

This issue could be duplicated from #669

[DavidBruchmann]

I can confirm the bug and the positive impact of the feature toggle.
without backtrace my error was this:

Uncaught (in promise) EvalError: Refused to evaluate a string as JavaScript because 'unsafe-eval' is not an allowed source of script in the following Content Security Policy directive: "script-src 'self' 'nonce-aLrV9gzsze8oMu90WBgdNn9X7EjAhTKaGOSux1VckgOlUB7ZkgLP_A' 'report-sample'".