-
Notifications
You must be signed in to change notification settings - Fork 3.4k
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
Link button broken #938
Comments
@mpriscella I've created a codepen with your toolbar options. I don't see an error with Chrome 53 on Windows 7. |
@benbro Nope, seems to be working there. Here's a screenshot of the behavior I'm experiencing, I'm still looking around the codebase but it looks like the tooltip is having trouble getting the bounds which is why it's off screen. Are there any other toolbar modules that use a tooltip which I could test? Maybe I'll be able to get some more helpful information. |
@jhchen might figure it from your screenshot. The video and formula(fx button) modules use a tooltip. |
Ahh, here we go - http://codepen.io/mpriscella/pen/pEJBKZ My container element doesn't have a defined height. |
With your codepen the tooltip doesn't show but I don't see an error in the console. |
I don't see the error either. I tried downloading |
I'm not seeing any errors on Mac + Chrome (same version is reported). Codepen displays errors to the console. You can just create an error to confirm. There is a .ql-snow .ql-out-bottom {
visibility: visible;
} |
To get the error, theme should be set to 'snow'; that theme relies on Can't do it myself, as I have no idea how should be |
I had a similar problem while trying to use it with a rails app I'm working on. Had to add |
@abelousov |
@jhchen I tried again being sure to set a defined height in my css but it's still failing for me. I also looked for any elements with high z-index's per your comment and was able to verify that there were none on the page. I've also removed any unnecessary javascript files from the page in the off chance that they could affect this (they didn't). As far as I can tell |
@jhchen found a way to reproduce it in chrome/firefox/safari on a mac, but not in codepen In the 1.0.3 distribution download. Modify the full example to load quill.js in the header instead of the body. |
I've reproduced a similar problem. In my case, I am 1) using Webpack to bundle assets and 2) dynamically creating Quill's using jQuery on clicks. I don't really have time at the moment to dive into debugging but I suspect that something in those use cases causes document.body to be undefined when the defaults are set. In my case, I got around it just by manually setting the bounds option when creating the Quill instance. |
Steps for Reproduction
As @etherbob said, when moving the quill.js script tag to the body, the error goes away. Quill.DEFAULTS = {
bounds: document.body,
} <!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style>
#editor-container {
height: 375px;
}
</style>
<link href="//cdn.quilljs.com/1.0.3/quill.snow.css" rel="stylesheet" type="text/css" />
<script src="//cdn.quilljs.com/1.0.3/quill.js"></script>
</head>
<body>
<div id="editor-container"></div>
<script>
var quill = new Quill('#editor-container', {
modules: {
toolbar: [
['link']
]
},
theme: 'snow'
});
</script>
</body>
</html> |
A possible fix: class Tooltip {
constructor(quill, boundsContainer) {
this.boundsContainer = boundsContainer || document.body; |
Ahh, that makes sense. Modified my toolbar options to the following and the link tooltip is now working as expected:
Thanks for the insight! |
The way I found to adjust this tooltip using only css is this:
|
The link button on my toolbar is failing to link the selected text.
Steps for Reproduction
Expected behavior:
Highlighted text is converted into an anchor tag.
Actual behavior:
Highlighted text is unaffected and the following error appears in the console
Uncaught TypeError: Cannot read property 'getBoundingClientRect' of null
.If you refer to the
js/quill.js
file in the1.0.3
release tarball, the error is happening around line9420
(which seems to originate here).Platforms:
Google Chrome 53.0.2785.101 (64-bit) running on OSX 10.11.6
Version:
1.0.3
The text was updated successfully, but these errors were encountered: