Bug Tracker

Opened 6 years ago

Closed 6 years ago

#15136 closed bug (invalid)

.wrap() clears text selection

Reported by: modular Owned by: modular
Priority: low Milestone: None
Component: unfiled Version: 1.11.1
Keywords: Cc:
Blocked by: Blocking:

Description

Select some text. Invoke a script that does wrap and unwrap. See your selection changed or cleared.

Can be demonstrated on https://api.jquery.com/wrap/ select some text in the demo and press the button

Why this is a problem: I encountered a script today on a website that uses wrap to create a 'share on twitter' icon (on mousedown).

This behavior is not intended, and a hidden 'feature' that should not be there.

(function(){
    $.fn.share = function(options) {
        var option = $.extend($.fn.share.defaults,options);
        $.extend($.fn.share,{
            init : function(shareable) {
                var self = this;
                $.fn.share.defaults.shareable = shareable;
                $.fn.share.defaults.shareable.on('mouseup',function(){
                    self.popOver();
                });
                $.fn.share.defaults.shareable.on('mousedown',function(){
                    self.destroy();
                });
            },
            getContent : function() {
                var current_url = window.location.href
                var selected_text = this.getSelection('string').substring(0,option.maxLength-(current_url.length+option.author_name.length+7));
                var text = encodeURIComponent('\"'+selected_text+'\" '+'--@'+option.author_name+' '+current_url)
                return '<a onclick="window.open(\''+option.shareLink+text+'\',\'_'+option.target+'\',\'location=yes,height=570,width=520,scrollbars=yes,status=yes\')"><i class="fa fa-twitter fa-lg"/></a>';
            },
            getSelection : function(share) {
                if(window.getSelection){
                    return (share=='string')?String(window.getSelection().getRangeAt(0)).replace(/\s{2,}/g, ' '):window.getSelection().getRangeAt(0);
                }
                else if(document.selection){
                    return (share=='string')?document.selection.createRange().text.replace(/\s{2,}/g, ' '):document.selection.createRange();
                }
            },
            popOver : function() {
                this.destroy();
                if(this.getSelection('string').length < option.minLength)
                    return;
                var data = this.getContent();
                var range = this.getSelection();
                var newNode = document.createElement("mark");
                range.surroundContents(newNode);
                $('mark').addClass(option.className);
                $('.'+option.className).popover({trigger:'manual', placement: option.placement, html: true 
                , content:function(){
                        return data;
                    }
                });
                $('.'+option.className).popover('show');
            },
            destroy : function(){
                $('.'+option.className).popover('hide');
                $('mark').contents().unwrap();
                $('mark').remove();
            }
        });
        $.fn.share.init(this);
    };
    
    $.fn.share.defaults = {
        shareLink : "http://twitter.com/intent/tweet?text=",
        minLength  : 2,
        maxLength  : 140,
        target     : "blank",
        className  : "share",
        placement  : "top",
    };

}());

Change History (5)

comment:1 Changed 6 years ago by modular

When a script like that removes your selection every time you right click, you cannot access the context menu, and that is a bug.

comment:2 Changed 6 years ago by dmethvin

Owner: set to modular
Status: newpending

select some text in the demo and press the button

Wnat button? There are no buttons in the demos.

comment:3 Changed 6 years ago by modular

Status: pendingnew

Sorry, wrong link: The button is on the unwrap demo page:

https://api.jquery.com/unwrap/

If you select one line, the selection will clear. If you select 3 lines, the selection will first clear the first line, then reselect the first and clear the third. Etcetera.

comment:4 Changed 6 years ago by dmethvin

Status: newpending

The act of manipulating the DOM causes the browser to clear the selection. Is there something in particular you think jQuery is doing that it should not do to avoid clearing the selection? Have you been able to do that using pure DOM for example?

comment:5 Changed 6 years ago by trac-o-bot

Resolution: invalid
Status: pendingclosed

Because we get so many tickets, we often need to return them to the initial reporter for more information. If that person does not reply within 14 days, the ticket will automatically be closed, and that has happened in this case. If you still are interested in pursuing this issue, feel free to add a comment with the requested information and we will be happy to reopen the ticket if it is still valid. Thanks!

Note: See TracTickets for help on using tickets.