Adding Require.JS breaks C5

Developing with Concrete
1

Hi,

Does anyone know why when including require.js into the template c5 Breaks. The editor no longer works.
https://requirejs.org/

2

To be clear, the in page editor no longer works. I can click on the pencil (edit) button and it seems I am in edit mode but clicking on any blocks does not bring up the editor for that block.

3

some more detail.
If I remove require.js C5 works as expected.
If I add require.js and look at developer tools I see this error:

TypeError: $.ui is undefined[Learn More] app.js:3:23824
ReferenceError: ConcreteToolbar is not defined[Learn More] index.php:1131:2

`

4

Well, funny enough, there is a workaround. I remarked the script inclusion. The browser still seems to pull in the file and nothing seems broken. So while not ideal, it’s working for now and I guess I’ll have to be ok with that.

I think this might actually lead to a real fix and I’ll look into it as time permits.
https://documentation.concretecms.org/developers/pages-themes/designing-for-concrete5/advanced-css-and-javascript-usage/requiring-core-javascript-or-css-in-a-theme

5

That the block add slide panel fails when your scripts are added, suggests the javascript is doing something that fundamentally disagrees with the slide panels.

The general good practice with any javascript is to not load it in edit mode (unless it is part of a the block’s edit dialogue).

In php $page->isEditMode() can be used to test.
In javascript, the global flag CCM_EDIT_MODE can be tested.

I usually check both because the php check $page->isEditMode() has on older core versions not been 100% reliable.

A $page->isEditMode() check can also result in incorrect data being added to a block cache, so consider the block cache flags in a custom block controller.

When a javascript is part of the edit dialogue, you also need to coinsider how it is initialised. You may not be able to depend on a ready event because as far as the browser was concerned, ready has already happened.