react-quill icon indicating copy to clipboard operation
react-quill copied to clipboard

Hyperlink without http:// redirect error

Open KodifyLLC opened this issue 3 years ago • 2 comments
trafficstars

When you select a text and hyperlink with google.com (for example) not starting with http:// or https:// it doesn't work, it redirects to an internal page. I recommend that you validate link and enforce inclusion of full url, or just pass link as is and let chrome figure it out.

KodifyLLC avatar Jan 18 '22 04:01 KodifyLLC

I used the solution given here, but agreed it would be nice if they were not relative links by default or there was an option to choose this https://stackoverflow.com/questions/40956020/how-can-i-prefill-links-with-http-in-a-quill-editor

var Link = Quill.import('formats/link');

class MyLink extends Link {
  static create(value) {
    let node = super.create(value);
    value = this.sanitize(value);
    if(!value.startsWith("http")) {
      value = "http://" + value;
    }
    node.setAttribute('href', value);
    return node;
  }
}

Quill.register(MyLink);

danbeggan avatar May 04 '22 10:05 danbeggan

Another solution is to override the Link.sanitize function as done here: https://github.com/quilljs/quill/issues/3188#issuecomment-703060216

DanielGibbsNZ avatar Jul 05 '22 22:07 DanielGibbsNZ