Results 1 to 6 of 6

Thread: [6.x] Ext.button.Button incorrect handling of attributes

    Thank you for reporting this bug. We will make it our priority to review this report.
  1. #1
    Ext JS Premium Member
    Join Date
    Mar 2007
    Location
    Germany
    Posts
    754

    Default [6.x] Ext.button.Button incorrect handling of attributes

    On an internal application we get errors when the client is used the Microsoft Edge 42.17134.1.0 (EdgeHTML 17.17134). This is a known bug in the browser that raise when something like this is in the source

    Code:
    <a target="_blank" href="https://www.microsoft.com/"> microsoft </a>
    <form><input type="text"/></form>
    In the console you get
    PHP Code:
    SCRIPT5009‘getReferrerPolicy_’ is not defined in Autoformfill_ContentScript.js 
    In my case the File-Upload started from a Button will failed. So i´m searching for a Workaround for this. I find a bug inside Ext.button.Button and overwrite this:


    The real bug is inside setHref: dom.removeAttribute('hrefTarget') -> should be dom.removeAttribute('target'); The other changes are marked with FIX-RB: <added|removed>


    PHP Code:
    /**
     * Override Ext.button.Button for correct handling the <target> attribute
     * 
     * 
     * When using the Microsoft EdgeHTML 17.17134 in some cases there is an error 
     * when clicking a link with target="_blank" like this:
     * 
     * <a target="_blank" href="https://www.microsoft.com/"> microsoft </a>
     * <form><input type="text"/></form>
     * 
     * The problem is inside Autoformfill_Contentscript.js: 
     * Inside this there is an undefined function getReferrerPolicy_ when
     * autofill is off.
     * 
     * The Ext.button.Button handled another functionality for the iPad if
     * the button is disabled or there is no href defined.
     * But in this case a wrong and unknow attribute will try to removed
     * 
     * Sample: 
     * wrong:    dom.removeAttribute('hrefTarget')   <- hrefTarget is not a known attribute
     * correct:  dom.removeAttribute('target')
     * 
     * 
     * https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/19407264/
     * 
     * Notes: - Changes are marked with FIX-RB
     * 
     *
     * - 2019/02/28 René Bartholomay <[email protected]>
     * 
     */
    Ext.define('RB.overrides.Ext.button.Button', {
        
    override 'Ext.button.Button',

        
    /**
         * Override the constructor for having a debug message if we use a newer 
         * framework version like 65357
         */
        
    constructor: function() {
            
    this.callParent(arguments);

            
    //<debug>
            
    if (parseInt(Ext.versions.ext.shortVersion) > 65357) {
                
    Ext.log({level'warn' }, 'Newer Ext-Framework detected: Override must be checked: ' +
                  
    '"Ext.button.Button" - remove wrong dom attribute when button href is false');
            }
            
    //</debug>
        
    },


        
    /**
         * Sets the href of the embedded anchor element to the passed URL.
         *
         * Also appends any configured {@link #cfg-baseParams} and parameters set through {@link #setParams}.
         * @param {String} href The URL to set in the anchor element.
         *
         */
        
    setHref: function(href) {
            var 
    me this,
                
    hrefTarget me.hrefTarget,
                
    dom;
     
            
    me.href href;
     
            if (!
    me.configuredWithPreventDefault) {
                
    me.preventDefault = !href;
            }
     
            if (
    me.rendered) {
                
    dom me.el.dom;
                
    // https://sencha.jira.com/browse/EXTJS-11964 
                // Disabled links are clickable on iPad, and right clickable on desktop browsers. 
                // The only way to completely disable navigation is removing the href 
                
    if (!href || me.disabled) {
                    
    dom.removeAttribute('href');
                    
    //dom.removeAttribute('hrefTarget');  // FIX-RB !! hrefTarget is not a known attribute
                    
    dom.removeAttribute('target');      // FIX-RB must be used without quotation marks
                
    } else {
                    
    dom.href me.getHref();
                    if (
    hrefTarget) {
                        
    dom.target hrefTarget;
                    }
                }
            }
        },

        
    /**
         * Sets the href of the link dynamically according to the params passed, and any {@link #baseParams} configured.
         *
         *     var button = Ext.create('Ext.button.Button', {
         *         renderTo   : document.body,
         *         text       : 'Open',
         *         href       : 'http://www.sencha.com',
         *         baseParams : {
         *             foo : 'bar'
         *         }
         *     });
         *
         *     button.setParams({
         *         company : 'Sencha'
         *     });
         *
         * When clicked, this button will open a new window with the url http://www.sencha.com/?foo=bar&company=Sencha because
         * the button was configured with the {@link #baseParams} to have `foo` = `'bar'`
         * and then used {@link #setParams} to set the `company` parameter to `'Sencha'`.
         *
         * **Only valid if the Button was originally configured with a {@link #href}**
         *
         * @param {Object} params Parameters to use in the href URL.
         */
        
    setParams: function(params) {
            var 
    me this,
                
    dom;

            
    me.params params;

            
    // https://sencha.jira.com/browse/EXTJS-11964 
            // Disabled links are clickable on iPad, and right clickable on desktop browsers. 
            // The only way to completely disable navigation is removing the href 
            
    if (me.rendered) {
                
    dom me.el.dom;
                if (
    me.disabled) {
                    
    dom.removeAttribute('href');
                    
    dom.removeAttribute('target');      // FIX-RB: added
                
    } else {
                    
    dom.href me.getHref() || '';

                    if (
    dom.ref !='') {                 // FIX-RB: added
                      
    dom.target hrefTarget;          // FIX-RB: added
                    
    }                                   // FIX-RB: added
                
    }
            }
        },
        
        
    onEnable: function() {
          var 
    me this,
              
    href me.href,
              
    hrefTarget me.hrefTarget,
              
    dom me.el.dom;

          
    // me.callParent();                           // FIX-RB: removed
          
    me.callSuper();                               // FIX-RB: added

          
    me.removeCls(me._disabledCls);
          
    me.el.setTabIndex(me.tabIndex);

          
    // https://sencha.jira.com/browse/EXTJS-11964 
          // Disabled links are clickable on iPad, and right clickable on desktop browsers. 
          // The only way to completely disable navigation is removing the href 
          
    if (href) {
              
    dom.href href;

              if (
    hrefTarget) {                         // FIX-RB: added
                
    dom.target hrefTarget;                // FIX-RB: added
              
    }
          }

          
    //if (hrefTarget) {                           // FIX-RB: removed
          //    dom.target = hrefTarget;                // FIX-RB: removed
          //}                                           // FIX-RB: removed
        
    }
    }) 

  2. #2
    Sencha - Forum Administrator
    Join Date
    Sep 2017
    Posts
    1,006

    Default

    Thank you so much for your post. I apologize for the delay. I have shared this with the support staff to look into at their earliest convenience. Your patience is greatly appreciated! We do suggest using the support portal when you need assistance with a capability of a Sencha product, you have identified a situation where a products behavior is inconsistent with the product documentation and might indicate a software bug, or when the communication between you and Sencha needs to be private.

    Thanks again,

    Michele



  3. #3
    Ext Support Team
    Join Date
    Jan 2018
    Posts
    569

    Default

    Hello,

    I request you to provide a working fiddle showcasing the issue for further analysis.

    Regards,
    Kumar
    Sencha Support.

  4. #4
    Sencha Premium User mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    40,449

    Default

    Quote Originally Posted by rakumar View Post
    Hello,

    I request you to provide a working fiddle showcasing the issue for further analysis.

    Regards,
    Kumar
    Sencha Support.
    Come on, it’s a simple thing to try in fiddle. Give it a shot, have some customer service.
    Mitchell Simoens @LikelyMitch
    Modus Create, Senior Fullstack Engineer
    ________________
    Modus Create is based on the model of an open source team. We’re a remote, global team of experts in our field. To find out more about the work we do, head over to our website.

    Check out my GitHub:
    https://github.com/mitchellsimoens

  5. #5
    Ext JS Premium Member
    Join Date
    Mar 2007
    Location
    Germany
    Posts
    754

    Default

    hi!

    there is no need for a fiddle.

    First:
    The bug inside the browser is described here:

    https://developer.microsoft.com/en-u...sues/19407264/

    Second:

    This is a typo, because It´s not the correct attribute (should be 'target'): the source: inside https://docs.sencha.com/extjs/6.7.0/...tton.js-1.html

    Code:
        setHref: function(href) {
            var me = this,
                hrefTarget = me.hrefTarget,
                dom;
     
            me.href = href;
     
            if (!me.configuredWithPreventDefault) {
                me.preventDefault = !href;
            }
     
            if (me.rendered) {
                dom = me.el.dom;
                
                // https://sencha.jira.com/browse/EXTJS-11964
                // Disabled links are clickable on iPad, and right clickable on desktop browsers.
                // The only way to completely disable navigation is removing the href
                if (!href || me.disabled) {
                    dom.removeAttribute('href');
                    dom.removeAttribute('hrefTarget');
                }
                else {
                    dom.href = me.getHref();
                    
                    if (hrefTarget) {
                        dom.target = hrefTarget;
                    }
                }
            }
        },
    Third:

    I restructured some code for using the target attribute only if there is also a href attribute...

    I real life the user will surely used a newer Version of the Internet-Explorer but my application must run on this specific version...

  6. #6
    Ext Support Team
    Join Date
    Jan 2018
    Posts
    569

    Default

    Hello,

    Thank you for the additional information. This has been registered as a bug in our tracker under reference number EXTJS-28213, the reference Jira will be linked here for you to track the status of the issue.

    Regards,
    Kumar
    Sencha Support.

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •