When animating auto layout height changes with an interactive component my prototype gives a JS error if the main frame is set to hug content

Interactive Components Bugs
1

I’m creating a page with accordions that would open and close when clicking on them using interactive components. But I get error in the console when trying to click on these and the prototypes get frozen and needs to be reloaded.

Skärmbild 2022-01-04 222942
Skärmbild 2022-01-04 2229422554×1367 209 KB 

prototype_app.min.js.br:4946 Uncaught TypeError: Cannot read property 'c' of null
    at tY.LK.va.ND (viewer.js.br:formatted:23263)
    at OM (viewer.js.br:formatted:10835)
    at Gh (viewer.js.br:formatted:10896)
    at HM (viewer.js.br:formatted:10392)
    at Zb (viewer.js.br:formatted:10442)
    at tY.LK.va.xs (viewer.js.br:formatted:23179)
    at Xp (viewer.js.br:formatted:10181)
    at Kx (viewer.js.br:formatted:10241)
    at Zb (viewer.js.br:formatted:10448)
    at tY.LK.va.xs (viewer.js.br:formatted:23179)
    at Xp (viewer.js.br:formatted:10181)
    at Kx (viewer.js.br:formatted:10241)
    at Zb (viewer.js.br:formatted:10448)
    at tY.LK.va.xs (viewer.js.br:formatted:23179)
    at Xp (viewer.js.br:formatted:10181)
    at Kx (viewer.js.br:formatted:10241)
    at Zb (viewer.js.br:formatted:10448)
    at tY.LK.va.xs (viewer.js.br:formatted:23179)
    at Xp (viewer.js.br:formatted:10181)
    at Kx (viewer.js.br:formatted:10241)
    at Zb (viewer.js.br:formatted:10448)
    at tY.va.xs (viewer.js.br:formatted:23179)
    at Xp (viewer.js.br:formatted:10181)
    at Kx (viewer.js.br:formatted:10241)
    at Zb (viewer.js.br:formatted:10448)
    at viewer.js.br:formatted:6166
    at kw (viewer.js.br:formatted:6586)
    at AJ (viewer.js.br:formatted:6165)
    at Pl (viewer.js.br:formatted:11022)
    at sq (viewer.js.br:formatted:12702)
    at TN (viewer.js.br:formatted:12696)
    at viewer.js.br:formatted:24779
    at g_.va.eh (viewer.js.br:formatted:27974)
    at xZ.va.YD (viewer.js.br:formatted:24772)
    at WG (viewer.js.br:formatted:3183)
    at viewer.js.br:formatted:3109
    at lf (viewer.js.br:formatted:19883)
    at I$.tb.i (viewer.js.br:formatted:26849)
    at i (prototype_app.min.js.br:4946)
va.ND @ viewer.js.br:formatted:23263
OM @ viewer.js.br:formatted:10835
Gh @ viewer.js.br:formatted:10896
HM @ viewer.js.br:formatted:10392
Zb @ viewer.js.br:formatted:10442
va.xs @ viewer.js.br:formatted:23179
Xp @ viewer.js.br:formatted:10181
Kx @ viewer.js.br:formatted:10241
Zb @ viewer.js.br:formatted:10448
va.xs @ viewer.js.br:formatted:23179
Xp @ viewer.js.br:formatted:10181
Kx @ viewer.js.br:formatted:10241
Zb @ viewer.js.br:formatted:10448
va.xs @ viewer.js.br:formatted:23179
Xp @ viewer.js.br:formatted:10181
Kx @ viewer.js.br:formatted:10241
Zb @ viewer.js.br:formatted:10448
va.xs @ viewer.js.br:formatted:23179
Xp @ viewer.js.br:formatted:10181
Kx @ viewer.js.br:formatted:10241
Zb @ viewer.js.br:formatted:10448
va.xs @ viewer.js.br:formatted:23179
Xp @ viewer.js.br:formatted:10181
Kx @ viewer.js.br:formatted:10241
Zb @ viewer.js.br:formatted:10448
(anonymous) @ viewer.js.br:formatted:6166
kw @ viewer.js.br:formatted:6586
AJ @ viewer.js.br:formatted:6165
Pl @ viewer.js.br:formatted:11022
sq @ viewer.js.br:formatted:12702
TN @ viewer.js.br:formatted:12696
(anonymous) @ viewer.js.br:formatted:24779
va.eh @ viewer.js.br:formatted:27974
va.YD @ viewer.js.br:formatted:24772
WG @ viewer.js.br:formatted:3183
(anonymous) @ viewer.js.br:formatted:3109
lf @ viewer.js.br:formatted:19883
I$.tb.i @ viewer.js.br:formatted:26849
i @ prototype_app.min.js.br:4946
requestAnimationFrame (async)
(anonymous) @ prototype_app.min.js.br:4946
I$.tb.i @ viewer.js.br:formatted:26850
i @ prototype_app.min.js.br:4946
requestAnimationFrame (async)
(anonymous) @ prototype_app.min.js.br:4946
I$.tb.i @ viewer.js.br:formatted:26850
i @ prototype_app.min.js.br:4946
requestAnimationFrame (async)
(anonymous) @ prototype_app.min.js.br:4946
I$.tb.i @ viewer.js.br:formatted:26850
i @ prototype_app.min.js.br:4946
requestAnimationFrame (async)
(anonymous) @ prototype_app.min.js.br:4946
I$.tb.i @ viewer.js.br:formatted:26850
i @ prototype_app.min.js.br:4946
requestAnimationFrame (async)
(anonymous) @ prototype_app.min.js.br:4946
I$.tb.i @ viewer.js.br:formatted:26850
i @ prototype_app.min.js.br:4946
requestAnimationFrame (async)
(anonymous) @ prototype_app.min.js.br:4946
I$.tb.i @ viewer.js.br:formatted:26850
i @ prototype_app.min.js.br:4946
requestAnimationFrame (async)
(anonymous) @ prototype_app.min.js.br:4946
I$.tb.i @ viewer.js.br:formatted:26850
i @ prototype_app.min.js.br:4946
requestAnimationFrame (async)
(anonymous) @ prototype_app.min.js.br:4946
I$.tb.i @ viewer.js.br:formatted:26850
i @ prototype_app.min.js.br:4946
requestAnimationFrame (async)
(anonymous) @ prototype_app.min.js.br:4946
I$.tb.i @ viewer.js.br:formatted:26850
i @ prototype_app.min.js.br:4946
requestAnimationFrame (async)
(anonymous) @ prototype_app.min.js.br:4946
I$.tb.i @ viewer.js.br:formatted:26850
i @ prototype_app.min.js.br:4946
requestAnimationFrame (async)
(anonymous) @ prototype_app.min.js.br:4946
I$.tb.i @ viewer.js.br:formatted:26850
i @ prototype_app.min.js.br:4946
requestAnimationFrame (async)
(anonymous) @ prototype_app.min.js.br:4946
I$.tb.i @ viewer.js.br:formatted:26850
i @ prototype_app.min.js.br:4946
requestAnimationFrame (async)
(anonymous) @ prototype_app.min.js.br:4946
I$.tb.i @ viewer.js.br:formatted:26850
i @ prototype_app.min.js.br:4946
requestAnimationFrame (async)
(anonymous) @ prototype_app.min.js.br:4946
I$.tb.i @ viewer.js.br:formatted:26850
i @ prototype_app.min.js.br:4946
requestAnimationFrame (async)
(anonymous) @ prototype_app.min.js.br:4946
I$.tb.i @ viewer.js.br:formatted:26850
i @ prototype_app.min.js.br:4946
requestAnimationFrame (async)
(anonymous) @ prototype_app.min.js.br:4946
I$.tb.i @ viewer.js.br:formatted:26850
i @ prototype_app.min.js.br:4946
requestAnimationFrame (async)
(anonymous) @ prototype_app.min.js.br:4946
I$.tb.i @ viewer.js.br:formatted:26850
i @ prototype_app.min.js.br:4946
requestAnimationFrame (async)
(anonymous) @ prototype_app.min.js.br:4946
I$.tb.i @ viewer.js.br:formatted:26850
i @ prototype_app.min.js.br:4946
requestAnimationFrame (async)
(anonymous) @ prototype_app.min.js.br:4946
I$.tb.i @ viewer.js.br:formatted:26850
i @ prototype_app.min.js.br:4946
requestAnimationFrame (async)
(anonymous) @ prototype_app.min.js.br:4946
I$.tb.i @ viewer.js.br:formatted:26850
i @ prototype_app.min.js.br:4946
requestAnimationFrame (async)
(anonymous) @ prototype_app.min.js.br:4946
I$.tb.i @ viewer.js.br:formatted:26850
i @ prototype_app.min.js.br:4946
requestAnimationFrame (async)
(anonymous) @ prototype_app.min.js.br:4946
I$.tb.i @ viewer.js.br:formatted:26850
i @ prototype_app.min.js.br:4946
requestAnimationFrame (async)
(anonymous) @ prototype_app.min.js.br:4946
I$.tb.i @ viewer.js.br:formatted:26850
i @ prototype_app.min.js.br:4946
requestAnimationFrame (async)
(anonymous) @ prototype_app.min.js.br:4946
I$.tb.i @ viewer.js.br:formatted:26850
i @ prototype_app.min.js.br:4946
requestAnimationFrame (async)
(anonymous) @ prototype_app.min.js.br:4946
I$.tb.i @ viewer.js.br:formatted:26850
i @ prototype_app.min.js.br:4946
requestAnimationFrame (async)
(anonymous) @ prototype_app.min.js.br:4946
I$.tb.i @ viewer.js.br:formatted:26850
i @ prototype_app.min.js.br:4946
requestAnimationFrame (async)
(anonymous) @ prototype_app.min.js.br:4946
I$.tb.i @ viewer.js.br:formatted:26850
i @ prototype_app.min.js.br:4946
requestAnimationFrame (async)
(anonymous) @ prototype_app.min.js.br:4946
I$.tb.i @ viewer.js.br:formatted:26850
i @ prototype_app.min.js.br:4946
requestAnimationFrame (async)
(anonymous) @ prototype_app.min.js.br:4946
I$.tb.i @ viewer.js.br:formatted:26850
i @ prototype_app.min.js.br:4946
requestAnimationFrame (async)
(anonymous) @ prototype_app.min.js.br:4946
I$.tb.i @ viewer.js.br:formatted:26850
i @ prototype_app.min.js.br:4946
requestAnimationFrame (async)
(anonymous) @ prototype_app.min.js.br:4946
I$.tb.i @ viewer.js.br:formatted:26850
i @ prototype_app.min.js.br:4946
requestAnimationFrame (async)
(anonymous) @ prototype_app.min.js.br:4946
I$.tb.i @ viewer.js.br:formatted:26850
i @ prototype_app.min.js.br:4946
Show 9 more frames
2 Likes
2

After some more investigations the behavior starts when the frame has a height based on auto layout (hug content). When setting the frame to fixed height it works.

I guess that hug content sets height to 100% but that the js function looks for a height in px to calculate how much to expand.

2 Likes
3

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.