Skip to content

feat: tooltips for all formatted URLs#2398

Merged
patrickhulce merged 5 commits intomasterfrom
url_tooltips
May 31, 2017
Merged

feat: tooltips for all formatted URLs#2398
patrickhulce merged 5 commits intomasterfrom
url_tooltips

Conversation

@patrickhulce
Copy link
Collaborator

@patrickhulce patrickhulce commented May 30, 2017

extends the goodness of #2312 to all audits formatting URLs

also adds an elideDataURI method to url shim to prevent enormous images from filling the LHR multiple times

@@ -62,11 +61,10 @@ class Deprecations extends Audit {

const deprecationsV2 = entries.filter(log => log.entry.source === 'deprecation').map(log => {
// CSS deprecations can have missing URLs and lineNumbers. See https://crbug.com/680832.
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Shall we remove the comment?

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

done

Copy link
Contributor

@brendankenny brendankenny left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

is there a general rule for this? When should an audit author be sure to shorten data URLs? Should _renderURL take care of that instead?

};

/**
* @param {string} url
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

add description

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

done

* @param {string} url
* @return {string}
*/
URL.elideDataURI = function elideDataURI(url) {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I guess preferring elideDataUri is already a losing battle :(

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

ha, yeah I've mostly given in at this point

URL.elideDataURI = function elideDataURI(url) {
try {
const parsed = new URL(url);
return parsed.protocol === 'data:' ? url.slice(0, 100) : url;
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

no clue when it could matter, but what about parsed.href.slice(0, 100)

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

that seems slightly more confusing to me since I started second guessing if parsed.href is somehow different from url, is there a reason you prefer it?

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

that seems slightly more confusing to me since I started second guessing if parsed.href is somehow different from url, is there a reason you prefer it?

making a reader second guess is a downside, but it does mean that any canonicalization or whatever that the URL constructor does is included.

OTOH, I have no clue if it would actually do anything to the beginning of a data URL that parsed successfully :)

parsed.toString().slice(0, 100) could be less confusing but does the same thing

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

it does mean that any canonicalization or whatever that the URL constructor does is included

I'm a little confused why we want this, it's going to be reprocessed by a new URL by the renderer in _renderUrl anyhow, so why would we want to mess with it more here?

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

yeah, I guess I'm thinking about URL.elideDataURI in isolation/other future uses. To me it makes sense to get a shortened version of the canonicalized URL out of calling it, but without a known change that could be made to it, up to you

@patrickhulce
Copy link
Collaborator Author

is there a general rule for this? When should an audit author be sure to shorten data URLs?

when there's a reasonable chance that the URL can be massive i.e. it can be a very large image, here I've done it to all audits where we might expect an image and left it off for those we don't

@brendankenny
Copy link
Contributor

when there's a reasonable chance that the URL can be massive i.e. it can be a very large image, here I've done it to all audits where we might expect an image and left it off for those we don't

is it this way (vs just in _renderURL for all callers) just to save details size?

@patrickhulce
Copy link
Collaborator Author

just to save details size?

correct-o

URL.elideDataURI = function elideDataURI(url) {
try {
const parsed = new URL(url);
return parsed.protocol === 'data:' ? url.slice(0, 100) : url;
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

yeah, I guess I'm thinking about URL.elideDataURI in isolation/other future uses. To me it makes sense to get a shortened version of the canonicalized URL out of calling it, but without a known change that could be made to it, up to you

@patrickhulce patrickhulce merged commit 6d35fa8 into master May 31, 2017
@patrickhulce patrickhulce deleted the url_tooltips branch May 31, 2017 17:39
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants