paulmataruso/zulip
1
0
Fork 0
mirror of https://github.com/zulip/zulip.git synced 2025-11-12 18:06:44 +00:00
Code Issues Packages Projects Releases Wiki Activity

emoji: Fix the title and alt text for unicode emojis.

Browse Source 
Unicode emojis when rendered should display canonical short name.
Similarly, the alt text should be of the format `:<short_name>:`.
For both of these we currently display the actual unicode symbol.
As some systems don't have the fonts necessary for displaying them
properly, they are rendered as empty square blocks. This commit also
ensures that the markup generated for emoji generated by canonical
name and by an unicode emoji is same.

Fixes: #5555.
This commit is contained in:
Harshit Bansal
2017-06-20 19:22:14 +05:30
committed by Tim Abbott
parent 8c92024fae
commit 4cb8ac100a
6 changed files with 32 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
frontend_tests/node_tests/markdown.js
View File

@@ -221,7 +221,7 @@ var bugdown_data = JSON.parse(fs.readFileSync(path.join(__dirname, '../../zerver
{input: 'This is an :poop: message', {input: 'This is an :poop: message',
expected: '<p>This is an <img alt=":poop:" class="emoji" src="/static/generated/emoji/images/emoji/unicode/1f4a9.png" title=":poop:"> message</p>'}, expected: '<p>This is an <img alt=":poop:" class="emoji" src="/static/generated/emoji/images/emoji/unicode/1f4a9.png" title=":poop:"> message</p>'},
{input: "\ud83d\udca9", {input: "\ud83d\udca9",
expected: '<p><img alt="\ud83d\udca9" class="emoji" src="/static/generated/emoji/images/emoji/unicode/1f4a9.png" title="\ud83d\udca9"></p>'}, expected: '<p><img alt=":poop:" class="emoji" src="/static/generated/emoji/images/emoji/unicode/1f4a9.png" title=":poop:"></p>'},
{input: '\u{1f937}', {input: '\u{1f937}',
expected: '<p>\u{1f937}</p>' }, expected: '<p>\u{1f937}</p>' },
{input: 'This is a realm filter #1234 with text after it', {input: 'This is a realm filter #1234 with text after it',

5
static/js/markdown.js
View File

@@ -118,9 +118,10 @@ function handleUnicodeEmoji(unicode_emoji) {
var hex_value = unicode_emoji.codePointAt(0).toString(16); var hex_value = unicode_emoji.codePointAt(0).toString(16);
if (emoji.emojis_by_unicode.hasOwnProperty(hex_value)) { if (emoji.emojis_by_unicode.hasOwnProperty(hex_value)) {
var emoji_url = emoji.emojis_by_unicode[hex_value]; var emoji_url = emoji.emojis_by_unicode[hex_value];
return '<img alt="' + unicode_emoji + '"' + var display_string = ':' + emoji_codes.codepoint_to_name[hex_value] + ':';
return '<img alt="' + display_string + '"' +
' class="emoji" src="' + emoji_url + '"' + ' class="emoji" src="' + emoji_url + '"' +
' title="' + unicode_emoji + '">'; ' title="' + display_string + '">';
} }
return unicode_emoji; return unicode_emoji;
} }

2
version.py
View File

@@ -1,2 +1,2 @@
ZULIP_VERSION = "1.6.0+git" ZULIP_VERSION = "1.6.0+git"
PROVISION_VERSION = '5.11' PROVISION_VERSION = '5.12'

18
zerver/fixtures/bugdown-data.json
View File

@@ -273,55 +273,55 @@
{ {
"name": "unicode_emoji", "name": "unicode_emoji",
"input": "\ud83d\udca9", "input": "\ud83d\udca9",
"expected_output":"<p><img alt=\"\ud83d\udca9\" class=\"emoji\" src=\"\/static\/generated\/emoji\/images\/emoji\/unicode\/1f4a9.png\" title=\"\ud83d\udca9\"><\/p>", "expected_output":"<p><img alt=\":poop:\" class=\"emoji\" src=\"\/static\/generated\/emoji\/images\/emoji\/unicode\/1f4a9.png\" title=\":poop:\"><\/p>",
"bugdown_matches_marked": true "bugdown_matches_marked": true
}, },
{ {
"name": "two_unicode_emoji", "name": "two_unicode_emoji",
"input": "\ud83d\udca9\ud83d\udca9", "input": "\ud83d\udca9\ud83d\udca9",
"expected_output":"<p><img alt=\"\ud83d\udca9\" class=\"emoji\" src=\"\/static\/generated\/emoji\/images\/emoji\/unicode\/1f4a9.png\" title=\"\ud83d\udca9\"><img alt=\"\ud83d\udca9\" class=\"emoji\" src=\"\/static\/generated\/emoji\/images\/emoji\/unicode\/1f4a9.png\" title=\"\ud83d\udca9\"><\/p>", "expected_output":"<p><img alt=\":poop:\" class=\"emoji\" src=\"\/static\/generated\/emoji\/images\/emoji\/unicode\/1f4a9.png\" title=\":poop:\"><img alt=\":poop:\" class=\"emoji\" src=\"\/static\/generated\/emoji\/images\/emoji\/unicode\/1f4a9.png\" title=\":poop:\"><\/p>",
"bugdown_matches_marked": true "bugdown_matches_marked": true
}, },
{ {
"name": "two_unicode_emoji_separated_by_text", "name": "two_unicode_emoji_separated_by_text",
"input": "\ud83d\udca9 word \ud83d\udca9", "input": "\ud83d\udca9 word \ud83d\udca9",
"expected_output":"<p><img alt=\"\ud83d\udca9\" class=\"emoji\" src=\"\/static\/generated\/emoji\/images\/emoji\/unicode\/1f4a9.png\" title=\"\ud83d\udca9\"> word <img alt=\"\ud83d\udca9\" class=\"emoji\" src=\"\/static\/generated\/emoji\/images\/emoji\/unicode\/1f4a9.png\" title=\"\ud83d\udca9\"><\/p>", "expected_output":"<p><img alt=\":poop:\" class=\"emoji\" src=\"\/static\/generated\/emoji\/images\/emoji\/unicode\/1f4a9.png\" title=\":poop:\"> word <img alt=\":poop:\" class=\"emoji\" src=\"\/static\/generated\/emoji\/images\/emoji\/unicode\/1f4a9.png\" title=\":poop:\"><\/p>",
"bugdown_matches_marked": true "bugdown_matches_marked": true
}, },
{ {
"name": "miscellaneous_symbols_and_pictographs", "name": "miscellaneous_symbols_and_pictographs",
"input": "Merry Christmas!!\ud83c\udf84", "input": "Merry Christmas!!\ud83c\udf84",
"expected_output":"<p>Merry Christmas!!<img alt=\"\ud83c\udf84\" class=\"emoji\" src=\"\/static\/generated\/emoji\/images\/emoji\/unicode\/1f384.png\" title=\"\ud83c\udf84\"><\/p>", "expected_output":"<p>Merry Christmas!!<img alt=\":christmas_tree:\" class=\"emoji\" src=\"\/static\/generated\/emoji\/images\/emoji\/unicode\/1f384.png\" title=\":christmas_tree:\"><\/p>",
"bugdown_matches_marked": true "bugdown_matches_marked": true
}, },
{ {
"name": "miscellaneous_and_dingbats_emoji", "name": "miscellaneous_and_dingbats_emoji",
"input": "\u2693\u2797", "input": "\u2693\u2797",
"expected_output":"<p><img alt=\"\u2693\" class=\"emoji\" src=\"\/static\/generated\/emoji\/images\/emoji\/unicode\/2693.png\" title=\"\u2693\"><img alt=\"\u2797\" class=\"emoji\" src=\"\/static\/generated\/emoji\/images\/emoji\/unicode\/2797.png\" title=\"\u2797\"><\/p>", "expected_output":"<p><img alt=\":anchor:\" class=\"emoji\" src=\"\/static\/generated\/emoji\/images\/emoji\/unicode\/2693.png\" title=\":anchor:\"><img alt=\":heavy_division_sign:\" class=\"emoji\" src=\"\/static\/generated\/emoji\/images\/emoji\/unicode\/2797.png\" title=\":heavy_division_sign:\"><\/p>",
"bugdown_matches_marked": true "bugdown_matches_marked": true
}, },
{ {
"name": "supplemental_symbols_and_pictographs", "name": "supplemental_symbols_and_pictographs",
"input": "I am a robot \ud83e\udd16.", "input": "I am a robot \ud83e\udd16.",
"expected_output":"<p>I am a robot <img alt=\"\ud83e\udd16\" class=\"emoji\" src=\"\/static\/generated\/emoji\/images\/emoji\/unicode\/1f916.png\" title=\"\ud83e\udd16\">.<\/p>", "expected_output":"<p>I am a robot <img alt=\":robot_face:\" class=\"emoji\" src=\"\/static\/generated\/emoji\/images\/emoji\/unicode\/1f916.png\" title=\":robot_face:\">.<\/p>",
"bugdown_matches_marked": true "bugdown_matches_marked": true
}, },
{ {
"name": "miscellaneous_symbols_and_arrows", "name": "miscellaneous_symbols_and_arrows",
"input": "Black upward arrow \u2b06", "input": "Black upward arrow \u2b06",
"expected_output":"<p>Black upward arrow <img alt=\"\u2b06\" class=\"emoji\" src=\"\/static\/generated\/emoji\/images\/emoji\/unicode\/2b06.png\" title=\"\u2b06\"><\/p>", "expected_output":"<p>Black upward arrow <img alt=\":arrow_up:\" class=\"emoji\" src=\"\/static\/generated\/emoji\/images\/emoji\/unicode\/2b06.png\" title=\":arrow_up:\"><\/p>",
"bugdown_matches_marked": true "bugdown_matches_marked": true
}, },
{ {
"name": "unicode_emoji_without_space", "name": "unicode_emoji_without_space",
"input": "Extra\ud83d\udc7dTerrestrial", "input": "Extra\ud83d\udc7dTerrestrial",
"expected_output":"<p>Extra<img alt=\"\ud83d\udc7d\" class=\"emoji\" src=\"\/static\/generated\/emoji\/images\/emoji\/unicode\/1f47d.png\" title=\"\ud83d\udc7d\">Terrestrial<\/p>", "expected_output":"<p>Extra<img alt=\":alien:\" class=\"emoji\" src=\"\/static\/generated\/emoji\/images\/emoji\/unicode\/1f47d.png\" title=\":alien:\">Terrestrial<\/p>",
"bugdown_matches_marked": true "bugdown_matches_marked": true
}, },
{ {
"name": "unicode_emojis_new_line", "name": "unicode_emojis_new_line",
"input": "\ud83d\udc7d\n\ud83d\udc7d", "input": "\ud83d\udc7d\n\ud83d\udc7d",
"expected_output":"<p><img alt=\"\ud83d\udc7d\" class=\"emoji\" src=\"\/static\/generated\/emoji\/images\/emoji\/unicode\/1f47d.png\" title=\"\ud83d\udc7d\"><br>\n<img alt=\"\ud83d\udc7d\" class=\"emoji\" src=\"\/static\/generated\/emoji\/images\/emoji\/unicode\/1f47d.png\" title=\"\ud83d\udc7d\"><\/p>", "expected_output":"<p><img alt=\":alien:\" class=\"emoji\" src=\"\/static\/generated\/emoji\/images\/emoji\/unicode\/1f47d.png\" title=\":alien:\"><br>\n<img alt=\":alien:\" class=\"emoji\" src=\"\/static\/generated\/emoji\/images\/emoji\/unicode\/1f47d.png\" title=\":alien:\"><\/p>",
"bugdown_matches_marked": true "bugdown_matches_marked": true
}, },
{ {

10
zerver/lib/bugdown/__init__.py
View File

@@ -700,7 +700,10 @@ class Avatar(markdown.inlinepatterns.Pattern):
path_to_name_to_codepoint = os.path.join(settings.STATIC_ROOT, "generated", "emoji", "name_to_codepoint.json") path_to_name_to_codepoint = os.path.join(settings.STATIC_ROOT, "generated", "emoji", "name_to_codepoint.json")
name_to_codepoint = ujson.load(open(path_to_name_to_codepoint)) name_to_codepoint = ujson.load(open(path_to_name_to_codepoint))
unicode_emoji_list = set([name_to_codepoint[name] for name in name_to_codepoint])
path_to_codepoint_to_name = os.path.join(settings.STATIC_ROOT, "generated", "emoji", "codepoint_to_name.json")
with open(path_to_codepoint_to_name) as codepoint_to_name_file:
codepoint_to_name = ujson.load(codepoint_to_name_file)
# All of our emojis(non ZWJ sequences) belong to one of these unicode blocks: # All of our emojis(non ZWJ sequences) belong to one of these unicode blocks:
# \U0001f100-\U0001f1ff - Enclosed Alphanumeric Supplement # \U0001f100-\U0001f1ff - Enclosed Alphanumeric Supplement
@@ -780,8 +783,9 @@ class UnicodeEmoji(markdown.inlinepatterns.Pattern):
# type: (Match[Text]) -> Optional[Element] # type: (Match[Text]) -> Optional[Element]
orig_syntax = match.group('syntax') orig_syntax = match.group('syntax')
codepoint = unicode_emoji_to_codepoint(orig_syntax) codepoint = unicode_emoji_to_codepoint(orig_syntax)
if codepoint in unicode_emoji_list: if codepoint in codepoint_to_name:
return make_emoji(codepoint, orig_syntax) display_string = ':' + codepoint_to_name[codepoint] + ':'
return make_emoji(codepoint, display_string)
else: else:
return None return None

13
zerver/tests/test_bugdown.py
View File

@@ -528,11 +528,20 @@ class BugdownTest(ZulipTestCase):
# type: () -> None # type: () -> None
msg = u'\u2615' # ☕ msg = u'\u2615' # ☕
converted = bugdown_convert(msg) converted = bugdown_convert(msg)
self.assertEqual(converted, u'<p><img alt="\u2615" class="emoji" src="/static/generated/emoji/images/emoji/unicode/2615.png" title="\u2615"></p>') self.assertEqual(converted, u'<p><img alt=":coffee:" class="emoji" src="/static/generated/emoji/images/emoji/unicode/2615.png" title=":coffee:"></p>')
msg = u'\u2615\u2615' # ☕☕ msg = u'\u2615\u2615' # ☕☕
converted = bugdown_convert(msg) converted = bugdown_convert(msg)
self.assertEqual(converted, u'<p><img alt="\u2615" class="emoji" src="/static/generated/emoji/images/emoji/unicode/2615.png" title="\u2615"><img alt="\u2615" class="emoji" src="/static/generated/emoji/images/emoji/unicode/2615.png" title="\u2615"></p>') self.assertEqual(converted, u'<p><img alt=":coffee:" class="emoji" src="/static/generated/emoji/images/emoji/unicode/2615.png" title=":coffee:"><img alt=":coffee:" class="emoji" src="/static/generated/emoji/images/emoji/unicode/2615.png" title=":coffee:"></p>')
def test_same_markup(self):
# type: () -> None
msg = u'\u2615' # ☕
unicode_converted = bugdown_convert(msg)
msg = u':coffee:' # ☕☕
converted = bugdown_convert(msg)
self.assertEqual(converted, unicode_converted)
def test_realm_patterns(self): def test_realm_patterns(self):
# type: () -> None # type: () -> None