Error while resizing with golden layout: Cannot read property 'appendChild' of null
Question

index.js:129 Uncaught TypeError: Cannot read property 'appendChild' of null at Object.postRender (index.js:129) at index.js:757 at Array.forEach (<anonymous>) at r.<anonymous> (index.js:756) at m (backbone.js:368) at v (backbone.js:356) at h (backbone.js:155) at r.c.trigger (backbone.js:346) at renderBody (CanvasView.js:263) at I (underscore.js:762)
Answers (3)
After init/render you can use the simple querySelector and move the DOM wherever you need, but again, I hope you don't re-render stuff manually
@Elvincth, as you have the error stack, click on the error to see exactly where it happens
@Elvincth, as you have the error stack, click on the error to see exactly where it happens
/**
* Initialize module. Automatically called with a new instance of the editor
* @param {Object} config Configurations
* @return {this}
* @private
*/
`
init(conf = {}) {
c = {
...defaults,
...conf
};
const em = c.em;
const ppfx = c.pStylePrefix;
this.em = em;
if (ppfx) {
c.stylePrefix = ppfx + c.stylePrefix;
}
this.selectorTags = new ClassTagsView({
collection: new Selectors([], { em, config: c }),
config: c
});
// Global selectors container
selectors = new Selectors(c.selectors);
selectors.on('add', model => em.trigger('selector:add', model));
selectors.on('remove', model => em.trigger('selector:remove', model));
selectors.on('change', model =>
em.trigger(
'selector:update',
model,
model.previousAttributes(),
model.changedAttributes()
)
);
em.on('change:state', (m, value) => em.trigger('selector:state', value));
return this;
},
postRender() {
const elTo = this.getConfig().appendTo;
if (elTo) {
const el = isElement(elTo) ? elTo : document.querySelector(elTo);
el.appendChild(this.render([])); //this line error
}
},
select(value, opts = {}) {
const targets = Array.isArray(value) ? value : [value];
const toSelect = this.em.get('StyleManager').setTarget(targets, opts);
const res = toSelect
.filter(i => i)
.map(sel =>
isComponent(sel)
? sel
: isRule(sel) && !sel.get('selectorsAdd')
? sel
: sel.getSelectorsString()
);
this.selectorTags.componentChanged({ targets: res });
return this;
},`

`index.js:129 Uncaught TypeError: Cannot read property 'appendChild' of null
at Object.postRender (index.js:129)
at index.js:757
at Array.forEach (<anonymous>)
at r.<anonymous> (index.js:756)
at m (backbone.js:368)
at v (backbone.js:356)
at h (backbone.js:155)
at r.c.trigger (backbone.js:346)
at renderBody (CanvasView.js:263)
at I (underscore.js:762)
postRender @ index.js:129
(anonymous) @ index.js:757
(anonymous) @ index.js:756
m @ backbone.js:368
v @ backbone.js:356
h @ backbone.js:155
c.trigger @ backbone.js:346
renderBody @ CanvasView.js:263
I @ underscore.js:762
(anonymous) @ underscore.js:775
(anonymous) @ underscore.js:122
(anonymous) @ jquery.min.js:2
Ie @ jquery.min.js:2
append @ jquery.min.js:2
addChild @ goldenlayout.min.js:2
_$onDrop @ goldenlayout.min.js:2
_onDrop @ goldenlayout.min.js:1
emit @ goldenlayout.min.js:1
onMouseUp @ goldenlayout.min.js:1
i @ jquery.min.js:2
dispatch @ jquery.min.js:2
v.handle @ jquery.min.js:2
load (async)
render @ CanvasView.js:488
render @ index.js:251
render @ EditorView.js:30
render @ index.js:761
init @ index.js:78
init_gjs @ main.js:5
(anonymous) @ jspanel.js:90
emit @ goldenlayout.min.js:1
init @ goldenlayout.min.js:1
e @ jquery.min.js:2
t @ jquery.min.js:2
setTimeout (async)
(anonymous) @ jquery.min.js:2
c @ jquery.min.js:2
fireWith @ jquery.min.js:2
fire @ jquery.min.js:2
c @ jquery.min.js:2
fireWith @ jquery.min.js:2
ready @ jquery.min.js:2
B @ jquery.min.js:2`Related Questions and Answers
Continue research with similar issue discussions.
Issue #3476
BUG: TypeError: Cannot read property 'querySelector' of null
<img width="1172" alt="Screenshot 2021-05-24 at 6 55 23 PM" src="https://user-images.githubusercontent.com/55732888/119354444-b8cbb500-bcc1...
Issue #4600
After Update to 0.20 from 0.19 the error Cannot assign to read only property 'defaults' of object '[object Object]' occurs
GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? chrome Reproducible demo link none Describ...
Issue #2681
[BUG]: destroy() method didn't fully remove events
version: latest: v-0.16.3. important: update from v-0.15.9 to v-0.16.3 while keep everything same, the error will show in console: This err...
Issue #2498
[Bug] Error when trying to move cell from row.
Bug #2478 after release still exists. Repeat steps and you will get error Uncaught TypeError: Cannot read property 'indexEl' of undefined....
Paid Plugins That Match This Issue
Curated by issue keywords and label relevance to help you ship faster.
Loading paid plugin recommendations...
Browse Plugin Categories
Jump directly to plugin category pages on the marketplace.