Chrome Version: 56.0.2924.79 (Official Build) beta (64-bit)
OS: CrOS
What steps will reproduce the problem?
(1) https://jsbin.com/muyezoj/6/edit?html,console,output
What is the expected result?
The emoji custom element runs like the rest.
What happens instead?
It doesn't run.
---
Here's the repro source:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>Emoji custom elements?</title>
<style>
omg-🙀, omg-cat, omg-𠀋 {
background: red;
height: 50px;
width: 70px;
padding: 10px;
display: block;
margin-bottom: 20px;
text-align: center;
}
</style>
</head>
<body>
<omg-🙀></omg-🙀>
<omg-cat></omg-cat>
<omg-𠀋></omg-𠀋>
</body>
<script>
class EmojiName extends HTMLElement {
constructor() {
super();
console.log('emoji constructor');
this.innerHTML = 'omg-🐱';
}
}
class TextName extends HTMLElement {
constructor() {
super();
console.log('text constructor');
this.innerHTML = 'omg-cat';
}
}
class KanjiName extends HTMLElement {
constructor() {
super();
console.log('kanji constructor');
this.innerHTML = 'omg-𠀋';
}
}
window.customElements.define('omg-🐱', EmojiName);
window.customElements.define('omg-cat', TextName);
window.customElements.define('omg-𠀋', KanjiName);
</script>
</html>
Comment 1 by domenic@chromium.org
, Feb 1 2017Status: Duplicate (was: Assigned)