Skip to content
This repository has been archived by the owner on Jan 24, 2021. It is now read-only.

Expand URLs and remove UTMs #161

Closed
wants to merge 23 commits into from

Conversation

polomarcus
Copy link

@polomarcus polomarcus commented Jan 10, 2019

Fixes #21

Features

When data-expanded-url attribute is available 2 features are activated :

Expand URLs

Replace t.co URLS with data-expanded-url data
screenshot from 2019-01-10 19-31-20
Tweet with a data-expanded-url

Remove UTMs

Remove UTMs from replaced URLs, leave the UTMs inside data-expanded-url though:
Tweet with UTMs to test this feature

Limit

It does not remove ref=producthunt from links

It does not affect twitter card link like this one as there is no data-expanded-url
and we need to have our own link unshorten API
screenshot from 2019-01-10 19-45-22

const urls = $('a[data-expanded-url]');

for (const el of urls) {
const expandedUrl = el.getAttribute('data-expanded-url');
Copy link
Owner

Choose a reason for hiding this comment

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

Should use .dataset

source/features/index.js Outdated Show resolved Hide resolved
source/features/expand-urls-remove-utms.js Outdated Show resolved Hide resolved
@@ -0,0 +1,13 @@
function removeUTMs(url) {
return url.replace(/[?&#]utm_.*/, '');
Copy link
Owner

Choose a reason for hiding this comment

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

It would be better to extract use the URL and URLSearchParams APIs to handle the query strings properly. Naive replacements like this is fragile.

readme.md Outdated
@@ -42,6 +42,7 @@ We use Twitter a lot and notice many dumb annoyances we'd like to fix. So here b
- Keyboard shortcut to toggle Night Mode (<kbd>Alt</kbd><kbd>m</kbd>).
- Uses your personal color theme on all profiles.
- Hides the header image on profile pages.
- Expand URLs and remove UTMs.
Copy link
Owner

Choose a reason for hiding this comment

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

Needs a better wording than UTMs. Few know what that means.

return url.replace(/[?&#]utm_.*/, '');
}

export default function () {
Copy link
Owner

Choose a reason for hiding this comment

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

The feature needs to ensure it's only run once. Now it's run on everything for each new tweet.

@sindresorhus
Copy link
Owner

It does not remove ref=producthunt from links

Why?

@sindresorhus
Copy link
Owner

It does not affect twitter card link like this one as there is no data-expanded-url
and we need to have our own link unshorten API

Can't we do the same as you do in https://github.com/polomarcus/faster-links/blob/910eeaf7d78c83d47dbf9116fde143ccf5c77480/app/scripts.babel/contentscript.js#L95 ?

@sindresorhus sindresorhus changed the title Expand urls and remove UTMs Expand URLs and remove UTMs Jan 11, 2019
@polomarcus
Copy link
Author

polomarcus commented Jan 11, 2019

Can't we do the same as you do in https://github.com/polomarcus/faster-links/blob/910eeaf7d78c83d47dbf9116fde143ccf5c77480/app/scripts.babel/contentscript.js#L95 ?

It uses Linkpeelr from @ibagrak , as he hasn't answered me since 2016 I guess it's OK to use it 😄 ibagrak/linkpeelr#15

Would you be OK to use it @sindresorhus ?

About ref=producthunt, it does not seem that product hunt uses it anymore

@sindresorhus
Copy link
Owner

Would you be OK to use it @sindresorhus ?

Sure. You can use ky for the fetching.

About ref=producthunt, it does not seem that product hunt uses it anymore

They do. Try clicking the "Website" button here: https://www.producthunt.com/posts/makerlog-2-0

@polomarcus
Copy link
Author

Update

✔️ No more shorten links
Note: the shorten link is only displayed on hover

⚠️ The full URL is displayed, and it can be long. We can trim the URL, to respect Twitter's policy on links (a maximum of 46 chars displayed)
After
screenshot from 2019-01-29 19-47-40
Before
screenshot from 2019-01-29 19-50-05

Next step

It does not affect twitter card link like this one as there is no data-expanded-url
and we need to have our own link unshorten API
screenshot from 2019-01-10 19-45-22


// Example: https://twitter.com/polomarcus/status/955649699477950464
async function twitterCardURLs() {
await sleep(2000); //iframes takes longer to load
Copy link
Author

Choose a reason for hiding this comment

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

Annoying... There is small lag when loading a Tweet card forcing me to use a sleep 😕

@sindresorhus
Copy link
Owner

Since the last time this PR had activity, Twitter launched their redesign to everyone, so I don't think this PR is functioning anymore... Are you still interested in finishing this and retargeting the new Twitter design or should I close?

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Expand t.co URLs and cleanup
3 participants