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

relative URLs are not resolved correctly when dynamic base tag is not supported #5757

Closed
ucavus opened this Issue Mar 12, 2013 · 3 comments

Comments

Projects
None yet
2 participants
@ucavus

ucavus commented Mar 12, 2013

href, src and action attributes are 'resolved' by simple concatenation:

//rewrite src and href attrs to use a base url
if ( !$.support.dynamicBaseTag ) {
    var newPath = path.get( fileUrl );
    console.log(newPath);
    page.find( "[src], link[href], a[rel='external'], :jqmData(ajax='false'), a[target]" ).each(function() {
        var thisAttr = $( this ).is( '[href]' ) ? 'href' :
                $( this ).is( '[src]' ) ? 'src' : 'action',
            thisUrl = $( this ).attr( thisAttr );

        // XXX_jblas: We need to fix this so that it removes the document
        //            base URL, and then prepends with the new page URL.
        //if full path exists and is same, chop it - helps IE out
        thisUrl = thisUrl.replace( location.protocol + '//' + location.host + location.pathname, '' );

        if ( !/^(\w+:|#|\/)/.test( thisUrl ) ) {
            $( this ).attr( thisAttr, newPath + thisUrl );
        }
    });
}

I don't know why it was written this way, but that is not how relative links are resolved. Using path.get() looks like it's meant to return a directory, but it clearly doesn't. The problem may exist elsewhere, too, like issue #4275 having no clear resolution.

@ucavus

This comment has been minimized.

Show comment
Hide comment
@ucavus

ucavus Mar 12, 2013

How about this? I left the case of relative URLs beginning with hashes untouched, since they can refer directly to pages' ids. Resolving normal URLs is just done with your existing function.

if ( !$.support.dynamicBaseTag ) {
    page.find( "[src], link[href], a[rel='external'], :jqmData(ajax='false'), a[target]" ).each(function() {
        var thisAttr = $( this ).is( '[href]' ) ? 'href' :
                $( this ).is( '[src]' ) ? 'src' : 'action',
            thisUrl = $( this ).attr( thisAttr );

        // XXX_jblas: We need to fix this so that it removes the document
        //            base URL, and then prepends with the new page URL.
        //if full path exists and is same, chop it - helps IE out
        thisUrl = thisUrl.replace( location.protocol + '//' + location.host + location.pathname, '' );

        if ( !/^#/.test( thisUrl ) ) {
            var newUrl = path.makeUrlAbsolute( thisUrl, fileUrl );
            if ( newUrl != thisUrl )
                $( this ).attr( thisAttr, newUrl );
        }
    });
}

ucavus commented Mar 12, 2013

How about this? I left the case of relative URLs beginning with hashes untouched, since they can refer directly to pages' ids. Resolving normal URLs is just done with your existing function.

if ( !$.support.dynamicBaseTag ) {
    page.find( "[src], link[href], a[rel='external'], :jqmData(ajax='false'), a[target]" ).each(function() {
        var thisAttr = $( this ).is( '[href]' ) ? 'href' :
                $( this ).is( '[src]' ) ? 'src' : 'action',
            thisUrl = $( this ).attr( thisAttr );

        // XXX_jblas: We need to fix this so that it removes the document
        //            base URL, and then prepends with the new page URL.
        //if full path exists and is same, chop it - helps IE out
        thisUrl = thisUrl.replace( location.protocol + '//' + location.host + location.pathname, '' );

        if ( !/^#/.test( thisUrl ) ) {
            var newUrl = path.makeUrlAbsolute( thisUrl, fileUrl );
            if ( newUrl != thisUrl )
                $( this ).attr( thisAttr, newUrl );
        }
    });
}
@ucavus

This comment has been minimized.

Show comment
Hide comment
@ucavus

ucavus Mar 22, 2013

Here's the test case, view the output alone not in the side frame of the edit page since it uses a relative URL.

In the first page, the image with the relative URL shows correctly. Clicking the test link (without dynamic base tag support), illustrates that the image on the dynamically loaded page does not show and how the URL has been mauled.

ucavus commented Mar 22, 2013

Here's the test case, view the output alone not in the side frame of the edit page since it uses a relative URL.

In the first page, the image with the relative URL shows correctly. Clicking the test link (without dynamic base tag support), illustrates that the image on the dynamically loaded page does not show and how the URL has been mauled.

@johnnypoll

This comment has been minimized.

Show comment
Hide comment
@johnnypoll

johnnypoll Jun 12, 2013

Is there any workaround or do we need to await a fix? I have:

  1. .mobile.dynamicBaseEnabled = false
  2. a static base url
  3. relative image src urls without a leading /
    If I navigate to a new page, jQM is adding (the wrong) URL onto my image src urls (taken from the page url and not my base url). If I then ask Safari to refresh the page, everything is as it should be, images fixed and jQM no longer alters my relative image urls which were correct in the first place.

Is there any workaround or do we need to await a fix? I have:

  1. .mobile.dynamicBaseEnabled = false
  2. a static base url
  3. relative image src urls without a leading /
    If I navigate to a new page, jQM is adding (the wrong) URL onto my image src urls (taken from the page url and not my base url). If I then ask Safari to refresh the page, everything is as it should be, images fixed and jQM no longer alters my relative image urls which were correct in the first place.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment