Preact: 10.0.0-rc1 difficult to track down crash

[mzealey]

Hi there, any advice on how I can track down a crash on code that works fine with react but breaks in preact - is it possible to force webpack/babel to use the source dist of the module rather than the dist? The error is Uncaught (in promise) TypeError: Cannot read property 'call' of undefined at y.r [as shouldComponentUpdate... but I cannot figure out the call process properly from the minified code to give you a decent bug report?

[marvinhagemeister]

Can you share a snippet which triggers the error? For us that's a lot more valuable than a stack trace :slightly_smiling_face:

[mzealey]

Unfortunately I can't even start figuring out how to get it down to a testcase as I have no clue where the issue is coming from in the app... Hence wondering if there is a way to at least get preact source code into the dev app build to track through with the debugger...

[robertknight]

Hi there, any advice on how I can track down a crash on code that works fine with react but breaks in preact

Can you provide a screenshot of the stack trace as it appears in Chrome dev tools when expanding the error?

Also, for each stack frame Chrome will display a link on the right side to the corresponding source location. If this source location is in a minified piece of code, you can press the "{ }" icon at the bottom of the debugger to get a more readable, but still minified, version of the code. A screenshot of the result in the debugger might be useful.

As for making Webpack use the source of Preact rather than the built version, it might be possible to make Webpack resolve import ... from 'preact' to preact/src/index.js, rather than the default of dist/preact.js, since Preact's source is plain (modern) JS.

[mzealey]

ok it appears to be something to do with using react-router-dom's Link as a component of a material ui Button... Will work on getting a test case but in my app converting:
<ListItem button divider component={Link} to={path} to <ListItem button divider component='a' to={path} seems to avoid the issue against latest git master.

[mzealey]

As for making Webpack use the source of Preact rather than the built version, it might be possible to make Webpack resolve import ... from 'preact' to preact/src/index.js, rather than the default of dist/preact.js, since Preact's source is plain (modern) JS.

I've been trying to do this with imports without much success unfortunately - webpack resolve and/or changing the paths in my es6 app imports dont seem to be getting anything run-able even with the git source checked out in node_modules

[mzealey]

Here is the full error - i can't get any meaningful info out of the debugger as I think it occurs in the previous promise so it has lost the state information by the time it gets to the actual issue. I cannot reproduce with a simple test case unfortunately.

Uncaught (in promise) TypeError: Cannot read property 'call' of undefined
    at d.t [as shouldComponentUpdate] (compat.module.js:49)
    at b (preact.module.js:13)
    at y (preact.module.js:13)
    at b (preact.module.js:13)
    at y (preact.module.js:13)
    at b (preact.module.js:13)
    at y (preact.module.js:13)
    at eval (preact.module.js:13)
    at b (preact.module.js:13)
    at y (preact.module.js:13)
--- expansion follows:
t @ compat.module.js:49
b @ preact.module.js:13
y @ preact.module.js:13
b @ preact.module.js:13
y @ preact.module.js:13
b @ preact.module.js:13
y @ preact.module.js:13
(anonymous) @ preact.module.js:13
b @ preact.module.js:13
y @ preact.module.js:13
b @ preact.module.js:13
y @ preact.module.js:13
b @ preact.module.js:13
y @ preact.module.js:13
b @ preact.module.js:13
y @ preact.module.js:13
b @ preact.module.js:13
y @ preact.module.js:13
b @ preact.module.js:13
y @ preact.module.js:13
b @ preact.module.js:13
d.forceUpdate @ preact.module.js:13
v @ preact.module.js:13
Promise.then (async)
m @ preact.module.js:13
(anonymous) @ preact.module.js:13
Provider.shouldComponentUpdate @ preact.module.js:13
b @ preact.module.js:13
y @ preact.module.js:13
b @ preact.module.js:13
y @ preact.module.js:13
b @ preact.module.js:13
y @ preact.module.js:13
b @ preact.module.js:13
y @ preact.module.js:13
b @ preact.module.js:13
y @ preact.module.js:13
b @ preact.module.js:13
y @ preact.module.js:13
b @ preact.module.js:13
y @ preact.module.js:13
b @ preact.module.js:13
y @ preact.module.js:13
(anonymous) @ preact.module.js:13
b @ preact.module.js:13
y @ preact.module.js:13
(anonymous) @ preact.module.js:13
b @ preact.module.js:13
y @ preact.module.js:13
(anonymous) @ preact.module.js:13
b @ preact.module.js:13
y @ preact.module.js:13
b @ preact.module.js:13
d.forceUpdate @ preact.module.js:13
v @ preact.module.js:13
Promise.then (async)
m @ preact.module.js:13
d.setState @ preact.module.js:13
(anonymous) @ songinfo.js:1654
Promise.then (async)
load_song @ songinfo.js:1650
componentDidUpdate @ songinfo.js:1636
b @ preact.module.js:13
y @ preact.module.js:13
b @ preact.module.js:13
y @ preact.module.js:13
b @ preact.module.js:13
y @ preact.module.js:13
b @ preact.module.js:13
y @ preact.module.js:13
b @ preact.module.js:13
y @ preact.module.js:13
b @ preact.module.js:13
y @ preact.module.js:13
b @ preact.module.js:13
y @ preact.module.js:13
b @ preact.module.js:13
y @ preact.module.js:13
b @ preact.module.js:13
y @ preact.module.js:13
b @ preact.module.js:13
y @ preact.module.js:13
b @ preact.module.js:13
y @ preact.module.js:13
b @ preact.module.js:13
d.forceUpdate @ preact.module.js:13
v @ preact.module.js:13
Promise.then (async)
m @ preact.module.js:13
d.setState @ preact.module.js:13
(anonymous) @ react-router.js:89
listener @ history.js:167
(anonymous) @ history.js:185
notifyListeners @ history.js:184
setState @ history.js:569
(anonymous) @ history.js:661
confirmTransitionTo @ history.js:157
push @ history.js:645
handleClick @ react-router-dom.js:159
onClick @ react-router-dom.js:179
C @ preact.module.js:13

[sventschui]

The issue seems to be caused when a ref is added to a memo'ed component that did not have a ref in the previous render. The next release should make things work again for you :)

[mzealey]

OK trying from the latest git - seems to be working correctly!