Support Tips for new Twitter site

[mandar-brave]

Issue:
It seems Twitter is A/B testing multiple sets of pages for users who are willing to opt in to those. One of those pages is mobile.twitter.com which is the responsive version. Our current solution for Twitter tipping breaks on the new site.

Solve:
Preferably fix prior to release.
Old site works reliably so far.

cc @emerick @NejcZdovc @alexwykoff

[jonathansampson]

Regarding selectors: [data-testid="tweet"] matches only Tweet elements on the mobile/new Twitter. [role="group"] matches only the action elements beneath Tweets.

[emerick]

That's really helpful! The other half of the puzzle would be gathering the various metadata associated with the tweet. We currently gather the following pieces of metadata:

• User ID of tweet author
• Real name of tweet author
• Twitter handle of tweet author
• Unique tweet ID
• Tweet timestamp
• Tweet text

Haven't looked in depth, but hoping it's not too hard to gather those once we have the tweet itself.

[jonathansampson]

New DOM doesn't make things easy. The following gathers most of the data, but the numerical user ID does not appear to be retrievable from the DOM.

const getMetaData = tweet => {

    const names = tweet.getElementsByTagName("a")[1].textContent.split("@")
    const status = tweet.querySelector("a[href*='/status/']")

    return {
        name: names[0],
        screenName: `@${names[1]}`,
        userId: "",
        tweetId: status.href.match(/\d+/)[0],
        tweetTimestamp: status.querySelector('time').dateTime,
        tweetText: tweet.querySelector('[lang]').textContent
    }
}

[mandar-brave]

@emerick move this to P1; we need to hotfix this in to current release.
@NejcZdovc FYI

[emerick]

@mandar-brave It looks like promoted tweets don't contain a timestamp link, which also happens to be where we scrape the tweet ID from. We need the tweet ID in order to quote the tweet when tweeting about our tip (it may be used elsewhere too, but that was the main place I saw it being used).

I would suggest for now that we disallow tipping promoted tweets on new Twitter, as I'm not sure we currently have a viable workaround for this. Let me know what you think, however.

[mandar-brave]

@emerick i am good with getting what we can; we should get a PR out without tipping promoted tweets ATM; leave the issue open to see if we can find a fix for the remain topics.

@davidtemkin for his opinion!

[GeetaSarvadnya]

@emerick For Promoted twitter tweets, the inline Tip link is NOT shown. Is this expected?. Thanks!

[emerick]

@GeetaSarvadnya Yes, for technical reasons (basically, we're unable to retrieve the tweet ID for promoted tweets) we don't allow tipping promoted tweets and thus don't show the tip icon for them.

[GeetaSarvadnya]

Verification passed on

Brave	0.67.117 Chromium: 76.0.3809.62 (Official Build) (64-bit)
Revision	7b77856b3aa34d72f246d12340fc1ded8b2c0e83-refs/branch-heads/3809@{#798}
OS	Windows 10 OS Version 1803 (Build 17134.523)

• Verified the test plan from Support Tips for new Twitter site brave-core#2943

• Verified there is no inline Tip icon when Rewards is NOT enabled

• Verified inline Tip icon display when Rewards is enabled
  

• Verified Tip icon disappear from twitter feed when uncheck "Twitter" checkbox in Tips Settings

• Verified Tip icon appear again in twitter feed when checking "Twitter" checkbox in Tips Settings

• Verified Tip icon display in newly loaded tweets when infinite scroll into the twitter feeds

• Verified the tipping banner after clicking on the Tip icon in the twitter feed
  

• Unable to test verified pubs due to Twitter verified pubs info is not displayed in BR panel #5388

Verified passed with

Brave	0.67.117 Chromium: 76.0.3809.62 (Official Build) (64-bit)
Revision	7b77856b3aa34d72f246d12340fc1ded8b2c0e83-refs/branch-heads/3809@{#798}
OS	Mac OS X

• Verified test plan from Support Tips for new Twitter site brave-core#2943 as it relates to in-line tipping only. All panel related items are blocked on Twitter verified pubs info is not displayed in BR panel #5388
• Encountered and logged incorrect tip banner text for tipping an image/video - follow up to 4548, 4583 #5412

Verification passed on

Brave	0.67.117 Chromium: 76.0.3809.62 (Official Build) (64-bit)
Revision	7b77856b3aa34d72f246d12340fc1ded8b2c0e83-refs/branch-heads/3809@{#798}
OS	Ubuntu 18.04 LTS

• Verified test plan from Support Tips for new Twitter site brave-core#2943
• Encountered Twitter verified pubs info is not displayed in BR panel #5388