miguelcobain / ember-paper

The Ember approach to Material Design.
http://miguelcobain.github.io/ember-paper
MIT License
889 stars 331 forks source link

PaperMenu flies into screen from left side on firefox #1160

Closed lucasmerat closed 3 years ago

lucasmerat commented 3 years ago

Recently while testing our app in FireFox, we noticed that the paper menu component has an odd animation issue. The menu will fly in from the top left side of the screen. I tested this in multiple contexts and different usages of the paper menu component.

Note that this is an intermittent issue and happens most, but not all of the time.

Here is a link to a screen cap of the interation: https://drive.google.com/file/d/11hpsmaBOl2Pq45hA7OhrQuVAjIa7inrY/view?usp=sharing

hergaiety commented 3 years ago

I see this happening consistently on https://miguelcobain.github.io/ember-paper/#/components/menu

Firefox 79.0 on Ubuntu

Attatching a few attempts at capturing it, but its very fast and difficult to record accurately.

Peek 2020-08-18 09-26

Peek 2020-08-18 09-25

pax7 commented 3 years ago

I have a similar (if not the same) issue where basically the @position is only honored the first time and then it flies in from the left.

CodingItWrong commented 3 years ago

There are some notes in #1151 related to a suggested fix for this

pax7 commented 3 years ago

I can confirm that this fixes flying from the left issue and the !paperElement issue:

if (!parentElement) {
      parentElement = document.getElementById('ember-basic-dropdown-wormhole');
    }

while this: if (!parentElement) return;

only fixes the !paperElement issue.

miguelcobain commented 3 years ago

I released this fix on 1.0.0-beta.33. Can you please try if it works now and reopen if there is any further related problems?

Also, @hergaiety, the can you please retry the website on Ubuntu and see if it is fixed now?

hergaiety commented 3 years ago

@miguelcobain thanks for your attempts at resolving this! Alas I'm still seeing the same on the website and within our app when bumping to 1.0.0-beta.33.

@lucasmerat would you check on your end as well and reopen this if needed?

lucasmerat commented 3 years ago

@hergaiety @miguelcobain Can confirm that I'm still seeing the issue on FireFox on the Ember Paper website and our app.

CodingItWrong commented 3 years ago

@lucasmerat Can you mark the GH issue as open for tracking?

Previously I saw this issue not only on Firefox but also Chrome and Safari iOS. With beta 33 I see Chrome and Safari iOS fixed, but not Firefox. Chrome:

chrome-works

Firefox:

firefox-does-not-work

lucasmerat commented 3 years ago

@CodingItWrong I'm not sure I know how to reopen the issue. Looking for that feature but can't seem to find it.

CodingItWrong commented 3 years ago

@lucasmerat I googled around and every time someone asks how to reopen a GitHub issue, the responses are always whether they can, but they don't say how 😂 😭 - So I guess our comments on the thread should be enough 👍