mirror of
				https://github.com/zulip/zulip.git
				synced 2025-11-04 14:03:30 +00:00 
			
		
		
		
	emoji: Fix the title and alt text for unicode emojis.
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:
		
				
					committed by
					
						
						Tim Abbott
					
				
			
			
				
	
			
			
			
						parent
						
							8c92024fae
						
					
				
				
					commit
					4cb8ac100a
				
			@@ -221,7 +221,7 @@ var bugdown_data = JSON.parse(fs.readFileSync(path.join(__dirname, '../../zerver
 | 
			
		||||
        {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>'},
 | 
			
		||||
        {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}',
 | 
			
		||||
         expected: '<p>\u{1f937}</p>' },
 | 
			
		||||
        {input: 'This is a realm filter #1234 with text after it',
 | 
			
		||||
 
 | 
			
		||||
@@ -118,9 +118,10 @@ function handleUnicodeEmoji(unicode_emoji) {
 | 
			
		||||
    var hex_value = unicode_emoji.codePointAt(0).toString(16);
 | 
			
		||||
    if (emoji.emojis_by_unicode.hasOwnProperty(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 + '"' +
 | 
			
		||||
               ' title="' + unicode_emoji + '">';
 | 
			
		||||
               ' title="' + display_string + '">';
 | 
			
		||||
    }
 | 
			
		||||
    return unicode_emoji;
 | 
			
		||||
}
 | 
			
		||||
 
 | 
			
		||||
@@ -1,2 +1,2 @@
 | 
			
		||||
ZULIP_VERSION = "1.6.0+git"
 | 
			
		||||
PROVISION_VERSION = '5.11'
 | 
			
		||||
PROVISION_VERSION = '5.12'
 | 
			
		||||
 
 | 
			
		||||
@@ -273,55 +273,55 @@
 | 
			
		||||
    {
 | 
			
		||||
      "name": "unicode_emoji",
 | 
			
		||||
      "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
 | 
			
		||||
    },
 | 
			
		||||
    {
 | 
			
		||||
      "name": "two_unicode_emoji",
 | 
			
		||||
      "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
 | 
			
		||||
    },
 | 
			
		||||
    {
 | 
			
		||||
      "name": "two_unicode_emoji_separated_by_text",
 | 
			
		||||
      "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
 | 
			
		||||
    },
 | 
			
		||||
    {
 | 
			
		||||
      "name": "miscellaneous_symbols_and_pictographs",
 | 
			
		||||
      "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
 | 
			
		||||
    },
 | 
			
		||||
    {
 | 
			
		||||
      "name": "miscellaneous_and_dingbats_emoji",
 | 
			
		||||
      "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
 | 
			
		||||
    },
 | 
			
		||||
    {
 | 
			
		||||
      "name": "supplemental_symbols_and_pictographs",
 | 
			
		||||
      "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
 | 
			
		||||
    },
 | 
			
		||||
    {
 | 
			
		||||
      "name": "miscellaneous_symbols_and_arrows",
 | 
			
		||||
      "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
 | 
			
		||||
    },
 | 
			
		||||
    {
 | 
			
		||||
      "name": "unicode_emoji_without_space",
 | 
			
		||||
      "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
 | 
			
		||||
    },
 | 
			
		||||
    {
 | 
			
		||||
      "name": "unicode_emojis_new_line",
 | 
			
		||||
      "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
 | 
			
		||||
    },
 | 
			
		||||
    {
 | 
			
		||||
 
 | 
			
		||||
@@ -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")
 | 
			
		||||
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:
 | 
			
		||||
# \U0001f100-\U0001f1ff - Enclosed Alphanumeric Supplement
 | 
			
		||||
@@ -780,8 +783,9 @@ class UnicodeEmoji(markdown.inlinepatterns.Pattern):
 | 
			
		||||
        # type: (Match[Text]) -> Optional[Element]
 | 
			
		||||
        orig_syntax = match.group('syntax')
 | 
			
		||||
        codepoint = unicode_emoji_to_codepoint(orig_syntax)
 | 
			
		||||
        if codepoint in unicode_emoji_list:
 | 
			
		||||
            return make_emoji(codepoint, orig_syntax)
 | 
			
		||||
        if codepoint in codepoint_to_name:
 | 
			
		||||
            display_string = ':' + codepoint_to_name[codepoint] + ':'
 | 
			
		||||
            return make_emoji(codepoint, display_string)
 | 
			
		||||
        else:
 | 
			
		||||
            return None
 | 
			
		||||
 | 
			
		||||
 
 | 
			
		||||
@@ -528,11 +528,20 @@ class BugdownTest(ZulipTestCase):
 | 
			
		||||
        # type: () -> None
 | 
			
		||||
        msg = u'\u2615'  # ☕
 | 
			
		||||
        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'  # ☕☕
 | 
			
		||||
        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):
 | 
			
		||||
        # type: () -> None
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user