Duplicate artist tags on Twitter

[BrokenEagle]

I noticed this phenomenon on Twitter, where navigating back-and-forth between the media and main timelines for an artist will cause additional artist tags to be added for each iteration.

• Main timeline: https://twitter.com/cojp35176498
• Media timeline: https://twitter.com/cojp35176498/media

I navigated back-and-forth using the "1,295 Photos and videos" link in the left sidebar for the main timeline, and the @cojp35176498 link below the profile photo in the left sidebar for the media timeline.

I also encountered this when developing on Twitter. It appears that the sections for the main and media timelines are kept separate but maintained while navigating back-and-forth, so anything rendered on those pages will still exist as the pages are never truly reloaded unless you F5 or open a link in a new tab.

Perhaps there should be a check for the .ex-artist-tag element already existing in the element being attached to (ex: .ProfileHeaderCard-screenname) before rendering?

[7nik]

I added a fix to the master branch. Could you check it?

[BrokenEagle]

I checked, and it no longer adds multiple artist tags when navigating back-and-forth, so the primary issue has been fixed.

However there was a few issues that I noted that may have existed before, but I can't be sure.

1. Artist tags are added to retweet identifiers. Not sure if this was intentional or not, but it does seem a bit superfluous.

2. After completing one full circuit of navigating back-and-forth, I noted that the qTip popups were no longer firing.

I also experienced something similar when developing a userscript on Twitter. It seems like when the page is navigated away from, even though all of the elements are still there, all of the event handlers become unbound. I had to assign namespaces to the events and detect when they were no longer bound to their elements.

https://github.com/evazion/translate-pixiv-tags/blob/f90318b6ab57667403e6f34b93c5c9073d5fcebd/translate-pixiv-tags.user.js#L485-L490

That is the code that needs to be rebound to those elements. Looking at Qtip on Danbooru, it seems like there is some common namespaces that can be looked at for detection. I'm showing how it looks on Danbooru along with the console command since the private data function $._data( ) doesn't work from the console on Twitter, but it should work from the userscript since the most recent version of jQuery is imported into it.

You can check it out for yourself on Twitter by looking at the right values under each of those artist tag elements as I did with the following.

Which in the userscript can be seen with the following code. The data right above those elements can also be detected with the $.data( ) command.

$._data($(".ex-artist-tag a")[0],'events');
$.data($(".ex-artist-tag a")[0]);

As expected, after navigating back-and-forth between the page, all of those jQuery data elements are missing from those artist tag links. So detecting that those elements are missing and reapplying the event handler could be one way to solve the problem.

[7nik]

1. I had to change one selector so it also was covering retweet identifiers. I excluded this case.
2. Yep, all bound events and jQuery data are removed when $.remove() is called. I added the rebounding of qTip.

[BrokenEagle]

Yeah, it all looks like it works now.