MAAS UI using up 100% CPU, Maximum call stack size exceeded

[Björn Tillenius]

While using MAAS, I noticed that chromium was using 100% CPU, with only MAAS 2.7 rc7 open in a tab, being almost completely unresponsive. Can't really say what triggered it. I was clicking around a bit in the UI, selecting which images to sync, looking at the controllers pages, deploying machines, etc.

Now it's settled down, and I see this in the JS console:

maas.f8ca02397f30196854e7.bundle.js:26 RangeError: Maximum call stack size exceeded
    at l (maas.f8ca02397f30196854e7.bundle.js:26)
    at c (maas.f8ca02397f30196854e7.bundle.js:26)
    at l (maas.f8ca02397f30196854e7.bundle.js:26)
    at c (maas.f8ca02397f30196854e7.bundle.js:26)
    at Object.se [as copy] (maas.f8ca02397f30196854e7.bundle.js:26)
    at We.getEmptyFilter (maas.f8ca02397f30196854e7.bundle.js:98)
    at We.getCurrentFilters (maas.f8ca02397f30196854e7.bundle.js:98)
    at c.Un.t.updateFilters (maas.f8ca02397f30196854e7.bundle.js:98)
    at M (maas.f8ca02397f30196854e7.bundle.js:98)
    at C (maas.f8ca02397f30196854e7.bundle.js:98)
(anonymous) @ maas.f8ca02397f30196854e7.bundle.js:26

maas.f8ca02397f30196854e7.bundle.js:26 RangeError: Maximum call stack size exceeded
    at Array.toString (<anonymous>)
    at maas.f8ca02397f30196854e7.bundle.js:26
    at c (maas.f8ca02397f30196854e7.bundle.js:26)
    at l (maas.f8ca02397f30196854e7.bundle.js:26)
    at c (maas.f8ca02397f30196854e7.bundle.js:26)
    at Object.se [as copy] (maas.f8ca02397f30196854e7.bundle.js:26)
    at We.getEmptyFilter (maas.f8ca02397f30196854e7.bundle.js:98)
    at We.getCurrentFilters (maas.f8ca02397f30196854e7.bundle.js:98)
    at c.Un.t.updateFilters (maas.f8ca02397f30196854e7.bundle.js:98)

I also see this further up in the JS console a few times:

  [DOM] Found 2 elements with non-unique id #power-type: (More info: <URL>)

[Björn Tillenius (bjornt)]

This was with Chromium 79.0.3945.130, with the following extensions:

  1Password X – Password Manager
  AdBlock — best ad blocker
  Bug 2 Trello 
  LastPass: Free Password Manager
  Quick Javascript Switcher
  Tab Auto Refresh
  The Great Suspender

[Caleb Ellis (caleb-ellis)]

I've managed to reproduce the error message once, but I can't confirm how. I believe it has to do with:
  1. how the current filtering system works, specifically with machines that are selected, and;
  2. state management in the angular version of the machine list. As in, with two-way data binding everywhere there is a disconnect between what is actually returned from the websocket and what exists in browser memory after an action is complete.

The UI did not become unresponsive, maybe a 1 second freeze until the browser killed the process. Otherwise, everything continued to work as normal. But still, I have not been able to reproduce it more than once.

[Adam Collard (adam-collard)]

https://paste.ubuntu.com/p/4WSPRWpQtH/ from FFx after killing when CPU max'd out on 2.7.0 on Machines page with one entry

[Adam Collard (adam-collard)]

This was addressed in https://github.com/canonical-web-and-design/maas-ui/pull/937