Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

'appendChild' of null in scrollbarSize.js:18

See original GitHub issue

I get this error when I run your example code:

scrollbarSize.js:18 Uncaught TypeError: Cannot read property 'appendChild' of null
    at exports.default (scrollbarSize.js:18)
    at Object.<anonymous> (index.js:138)
    at __webpack_require__ (bootstrap 1891148…:19)
    at Object.<anonymous> (bundle.js:5069)
    at Object.exports.__esModule (bundle.js:5561)
    at __webpack_require__ (bootstrap 1891148…:19)
    at Object.<anonymous> (index.js:3)
    at __webpack_require__ (bootstrap 1891148…:19)
    at Object.<anonymous> (entry.jsx:3)
    at __webpack_require__ (bootstrap 1891148…:19)

Steps to reproduce:

npm install babel-core babel-loader babel-preset-es2015 babel-preset-react css-loader react react-addons-css-transition-group react-dom react-infinite-calendar style-loader webpack --save
create webpack.config.js
create index.html with <div id='root'></div>
webpack
copy paste example into entry.jsx
open index.html

Issue Analytics

State:
Created 6 years ago
Reactions:3
Comments:5 (2 by maintainers)

Top GitHub Comments

7reactions

micahalcorncommented, May 8, 2017

@dben89x yes, @clauderic is correct that you can solve the problem by moving your <%= javascript_include_tag 'application' %> out of the <head> and into the end of the <body>, although I’m not clear on why react_on_rails is not handling this sort of thing. You can see a similar discussion here on the react-big-calendar repo.

2reactions

claudericcommented, Apr 5, 2017

This is the line that’s causing an error: https://github.com/react-bootstrap/dom-helpers/blob/master/src/util/scrollbarSize.js#L16

The only scenario where document.body would be undefined is if you’re trying to access it before it’s declared (i.e., if your script is in the <head> of the page).

Either place your script at the end of the <body> tag or defer the javascript from being initialized until the document is ready.

Top Results From Across the Web

Uncaught TypeError: Cannot read property 'appendChild' of null

The "Cannot read property 'appendChild' of null" error occurs for 2 reasons: Calling the appendChild() method on a DOM element that doesn't ...

TypeError: Cannot read property 'appendChild' of Null in JS

The "Cannot read property 'appendChild' of null" error occurs for 2 reasons: Calling the appendChild() method on a DOM element that doesn't exist,...

Incident Response - Hybrid Analysis

appendChild (scrollDiv);mfp.scrollbarSize = scrollDiv.offsetWidth - scrollDiv.clientWidth;document.body.removeChild(scrollDiv);}return mfp.scrollbarSize;}} ...

https://www.museomadignano.it/pages/build/IWT.min....

getComputedStyle(element, null);\n return property ? css[property] : css ... rect.top\n };\n\n // subtract scrollbar size from sizes\n var sizes = element.

TypeError: Cannot read property 'appendChild' of null bpm ...

I tried implementing bpmn in reactjs using this source https://github.com/bpmn-io/bpmn-js-properties-panel , so I've written a route for my ...