Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Bubble theme page beta broken #679

Closed
WriterStat opened this issue May 19, 2016 · 7 comments
Closed

Bubble theme page beta broken #679

WriterStat opened this issue May 19, 2016 · 7 comments

Comments

@WriterStat
Copy link

You guys probably already know this...But just in case...

5/19/2016 - Bubble theme seems broken. It bubbles, but items in it don't all seem to work. http://beta.quilljs.com/docs/themes/bubble/

Probably just a beta thing, but just in case...

Tested in FF, Chrome

Cheers, thanks for cool software.

@jhchen
Copy link
Member

jhchen commented May 19, 2016

All the buttons work for me on Mac 10.11 + Chrome 50. What ones are not working for you? Can you provide specific steps for reproduction as well.

@WriterStat
Copy link
Author

Sure will give you a quick list in a little bit. And will check again.

Using win 10 and win 8.1 Newest/current version of Firefox. And Google Chrome as well. I'll check the version of Google Chrome I have, but I believe it's the up to date newest, will check to make sure.

Sometimes works intermittently, if you keep trying it over and over...

So basically I visit the beta page, type asdfg highlight it, bubble comes up I choose bold and nada, then Italics and nada, bold and nada, then italics and nada, then I choose bold again and it bolds, if I keep trying, after that it may or may not italics or bold. But the percentage chance it will is higher.

Opening the Firefox console I get this warning when using the beta software:

mutating the [[Prototype]] of an object will cause your code to run very slowly; instead create the object with the correct initial [[Prototype]] value using Object.create quill.js:3831:416

Possible it just runs slow? Maybe the emitter/events? Not sure. Feels like it's working on something/sluggish, but no response. Wish I could tell you more, I could put it on a debugger I guess. I'd just be guessing until then.

I'll check this in win 8.1 Will try this as well on my laptop/touchtop.

Cheers, -C

@jhchen
Copy link
Member

jhchen commented May 23, 2016

That warning is generated by Babel and probably a red herring as I tried on a VM with limited resources. Can anyone else reproduce?

@WriterStat
Copy link
Author

WriterStat commented May 24, 2016

That's def possible. Is Babel creating an array subclass in ES5? I'm guessing that might trigger the aggressive warning in FireFox. There is no warning in Chrome.

I'm going to check on my touchtop, win 10, newest Chrome/Firefox/Edge. The odd thing is there is no error thrown that I can see in the console when the buttons don't trigger or trigger but don't respond. It just intermittently ignores your click on the bubble buttons, curious, but only on the bubble version, snow version works just fine. Cheers, I'll attach a screencast of me doing it. It won't be an answer. But it will show the problem, for whatever it's worth. I just figured it was a beta thing. maybe it's a Babel Transpiling thing es2015.

Anywho at least you will have proof. Will do in a day or so.

@jhchen
Copy link
Member

jhchen commented May 24, 2016

To be clear my previous comment attempted to make the following points:

  1. I think the problem has nothing to do with Babel or the warning being emitted in Firefox
  2. I cannot reproduce, even on a low resourced VM
  3. It would be helpful if someone else can reproduce and shed more perspective or get closer to consistent reproduction to nail down a root cause

@emanuelbsilva
Copy link

Also happens with me. Exactly as @WriterStat says. I'm on Chrome 49 on OSX.

What happens is that when clicking a button on the toolbar there is an SELECTION_CHANGE event being triggered with a null range. When the range is null the toolbar is hidden before the click handler for the button to trigger.

The SELECTION_CHANGE event is being triggered by the Selection module using a setTimeout on the update method. The range is null because the editor doest not have focus. On the getRange function: if (!this.hasFocus()) return [null, null];. The Dom Event that led to this was the focus.

Looking at the function hasFocus the document.activeElement is being tested, on my scenario the active element is the button: <button class="ql-bold ql-active">..</button>.

So that's probably why the issue is happening. Maybe stopping the propagation when focusing the ql-tooltip or moving the toolbar out of the editor container could fix the issue.

Hope i could help!
Cheers!

@sachinrekhi
Copy link
Contributor

I'm experiencing this issue as well in Chrome 50 on Mac 10.11

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants