Materialize: Junk input elements get created and never destroyed - bad garbage collection

Created on 29 May 2019  路  7Comments  路  Source: Dogfalo/materialize


I apologize if this has been reported or addressed, but I couldn't find a similar issue. I ran into an issue I initially thought was my fault in my React app not doing proper garbage collection, but then I reproduced it on your doc site materializecss.com.

I order to understand this, I think a pic is best, but basically hitting the Enter key on an input field produces an additional, hidden input (display: none) element, 3 at a time, each time you hit Enter and never gets destroyed.

<input type="text" data-dashlane_trigger_mutation="true" style="display: none;"> 

Screen-Shot-2019-05-28-at-9-26-43-PM

Expected Behavior


I would expect that these elements are destroyed on the next press of Enter if they are in fact needed at all.

Current Behavior


Pressing Enter produces 3 of these elements each time, seemingly indefinitely.
Changing them from display: hidden to display: block produces a single input bottom line (the colored border).
Screen-Shot-2019-05-28-at-9-32-52-PM


If this is intended behavior, I would suggest using a method that is not so wasteful; these could easily become a memory leak in an SPA.

Possible Solution



Maybe tie an event that checks for the existence of the elements and then uses remove() to destroy them.
Something like:

function junk() {
  const garbage = document.querySelectorAll('[data-dashlane_trigger_mutation="true"]');
  if (garbage !== null) garbage.forEach((junk) => junk.remove())
}

Steps to Reproduce (for bugs)


  1. Go here: https://materializecss.com/text-inputs.html.
  2. Open the Chrome dev tools using Cmd + Option + I, right-click and Inspect or F12.
  3. Select Elements and scroll to the bottom (in dev tools, not on the page).
  4. Place your cursor in the "First Name" field in the first example.
  5. Press Enter and watch the junk fields get created at the bottom.

Context



The primary issue is the potential for other bugs, unintended behavior and resource usage. I will work around this by implementing something similar to my suggestion in my own app.

Your Environment


  • Version used: 1.0.0
  • Browser Name and version: Chrome Version 74.0.3729.169 (Official Build) (64-bit) (macOS)
  • Operating System and version (desktop or mobile): macOS 10.14.5

Most helpful comment

Hey guys,
I'm representing Dashlane, that's our bad sorry for the inconvenience we'll make sure a fix is shipped with our next extension (soonish).

Thank you for the thorough user support ticket !

All 7 comments

@Dogfalo @DanielRuf @acburst

Is this still being maintained? I noticed the last resolved issue was closed in 2018.

I will try to put in a PR to solve my issue, but I'm just curious if there's a need for someone else to maintain this?

This looks to be caused by a browser extension (Dashlane). Is this correct?

@DanielRuf OMG I can鈥檛 believe I didn鈥檛 notice that. Yep, that is definitely the issue.

Still, my other question stands - is there a need for assistance tackling issues? I鈥檓 happy to review and see if I can assist.

But this issue can be closed ;)

Still, my other question stands - is there a need for assistance tackling issues? I鈥檓 happy to review and see if I can assist.

馃檶 that would be really awesome

Regarding the bug with the extension, can you report it to the support of Dashlane?

Please let us keep updated regarding this if this is just a problem with their approach or if it is a general issue which affects more implementations and use cases so we can take a closer look and provide a solution for all use cases.

Regarding the bug with the extension, can you report it to the support of Dashlane?

Please let us keep updated regarding this if this is just a problem with their approach or if it is a general issue which affects more implementations and use cases so we can take a closer look and provide a solution for all use cases.

I'm not sure it's a bug - they place an indicator in input fields to allow you to use their password manager for that field. If you were to submit it but for some reason chose the wrong password, then they do this yet again to allow you to chose the right one or use the password generator.

But yeah, theoretically the old ones should get destroyed. I'll look into that and report it to them.

Still, my other question stands - is there a need for assistance tackling issues? I鈥檓 happy to review and see if I can assist.

馃檶 that would be really awesome

I will try to take a look over the next week as I get free time.

Hey guys,
I'm representing Dashlane, that's our bad sorry for the inconvenience we'll make sure a fix is shipped with our next extension (soonish).

Thank you for the thorough user support ticket !

Was this page helpful?
0 / 5 - 0 ratings

Related issues

lpgeiger picture lpgeiger  路  3Comments

alexknipfer picture alexknipfer  路  3Comments

bradley-varol picture bradley-varol  路  3Comments

PhillippOhlandt picture PhillippOhlandt  路  3Comments

SoproniOli713 picture SoproniOli713  路  3Comments