Page MenuHomePhabricator

Add Open Graph support to Phabricator Maniphest Tasks to have link preview on Telegram, Slack, and other messaging apps
Open, LowPublicFeature

Description

Description

At the Wikimedia foundation we use Phabricator as our main task tracking system for software development. As such we are constantly sharing links to Phabricator tasks with each other on Slack and other messaging apps (e.g. IRC, Discord, etc.). Phabricator task links are not descriptive, they are a series of letters and numbers (e.g. https://phabricator.wikimedia.org/T283757), therefore when you see a link to a Phabricator task in Slack you likely do not know what task it represents until you click on the link and navigate to the task.

I believe that it would improve communication, and overall productivity, if Slack (and other messaging apps) showed some kind of minimal previews for Phabricator links.

currentproposed
image.png (487×760 px, 150 KB)
image.png (487×760 px, 152 KB)

Documentation

https://ogp.me/


Upstream Task in Phorge:

https://we.phorge.it/T15472

Event Timeline

valerio.bozzolan renamed this task from Show previews for Phabricator links in Slack (and other messaging apps) to Add Open Graph support to Phabricator Maniphest Tasks to have link preview on Telegram, Slack, and other messaging apps.Apr 11 2023, 7:11 AM
valerio.bozzolan updated the task description. (Show Details)
valerio.bozzolan subscribed.

Interestingly, the Open Graph protocol project itself is now in a really abandoned state.

https://github.com/facebookarchive/open-graph-protocol/pull/50

Aklapper changed the subtype of this task from "Task" to "Feature Request".Nov 14 2023, 11:17 AM

Syncing from an answer I have made on our internal Slack in early September following this question by @gmodena asking how to integrate tools in Slack

Are you aware of any effort to integrate phab, gerrit and gitlab with Slack? E.g. bots like https://github.com/etcinit/phabulous

For Gerrit I looked at how Slack could potentially render a preview of the link. Slack relies on embedded data at the target page (a process they name URL unfurling apparently based on OpenGraph / Twitter card / <meta> or something.

Slack has a debugger at https://api.slack.com/tools/unfurl-debugger (under Team pick "████████████" then under URL insert some url such as a Gerrit change, Phabricator page or Gitlab page and see what happens.

For Gerrit that gives:
Result
No usable content found.
Log

Gerrit doesn't seem to provide any relevant meta tag beside the description Gerrit Code Review

That is similar for Phabricator (which is the purpose of this task). If I ask parse https://phabricator.wikimedia.org/T2001

Result
No usable content found.
Log

For Gitlab there are few issues filed such as:

That is for the problem statement, continuing in next message

Interesting. Thanks!

As a side note, I'm sorry if Slack does not integrate better with stuff, but please understand me if I'm not inclined to contribute as volunteer to any integration with any specific proprietary software like Slack in general. Being involved in Slack details makes me feel very uncomfortable. I also don't know why Slack is required to work in WMF for most positions. This seems like something to think about, even if OT here. (But were we can talk about Slack?)

To add support to OpenGraph, I think we need to explore what we have at the moment, that is, probably:

https://secure.phabricator.com/rP49b57eae7df52c189aef1d973823c697fc97fd4b
https://secure.phabricator.com/T13018
https://secure.phabricator.com/T13018#233394

In particular, from Evan:

To move forward, we'd probably need to add methods like setOpenGraphTextDescription(), setOpenGraphRemarkupDescription(), and setOpenGraphEmptyDescription() to StandardPageView

Probably, we need to just see the last link and take inspiration. Probably not. But that is an interesting starting point.

Adding metadata should be achievable since Phabricator is written in PHP and we have good relation with upstream. One would have to pick a format to support given:

  • Facebook OpenGraph is apparently abandoned (edit: as noted above by Valerio T288117#8931772
  • Twitter Card might be in a poor shape
  • I don't know whether Slack supports OEmbed which was a tentative to establish a standard but is not one afaik :)

There is a 2010 task by Brion Vibber about adding OEmbed for MediaWiki which is T27854 and which has useful links.

For MediaWiki, I think that got implemented in 2020 via T157145 which went to use og meta tags. They are Facebook OpenGraph tags which are documented at https://developers.facebook.com/docs/sharing/webmasters/

...
As a side note, I'm sorry if Slack does not integrate better with stuff, but please understand me if I'm not inclined to contribute as volunteer to any integration with any specific proprietary software like Slack in general. Being involved in Slack details makes me feel very uncomfortable. I also don't know why Slack is required to work in WMF for most positions. This seems like something to think about, even if OT here. (But were we can talk about Slack?)

I hear you, I have mentioned Slack in my previous comment ( T288117#9356136 ) since the question was asked there and I did the analysis with Slack in mind and I merely copy pasted my answer. The reason is Telegram, Slack, Wordpress etc all more or less rely on Open Graph tags to be added to the task with `Slack being a detail :-)

To add support to OpenGraph, I think we need to explore what we have at the moment, that is, probably:

https://secure.phabricator.com/rP49b57eae7df52c189aef1d973823c697fc97fd4b
https://secure.phabricator.com/T13018
https://secure.phabricator.com/T13018#233394

In particular, from Evan:

To move forward, we'd probably need to add methods like setOpenGraphTextDescription(), setOpenGraphRemarkupDescription(), and setOpenGraphEmptyDescription() to StandardPageView

Probably, we need to just see the last link and take inspiration. Probably not. But that is an interesting starting point.

My guess is Facebook abandoned their repo/page in favor of the documentation https://developers.facebook.com/docs/sharing/webmasters/

Twitter has its own tags, then their documentation ( https://developer.twitter.com/en/docs/twitter-for-websites/cards/overview/markup ) mentions Facebook OpenGraph tags.

My conclusion is Facebook OpenGraph tags, short of being a standard, are the de facto most supported ones and I guess one can look at adding support for them in Phorge.