<p dir="auto">ES6 supports duplicate properties in object literals even in strict mode, but some (recent versions of) browsers still fail to parse strict mode code that has object literals with duplicate properties. Chrome 38 and Safari 8 are two browsers like this.</p>
<p dir="auto">Currently, the following code:</p>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="var x = {o: 5, o: 6};"><pre class="notranslate"><span class="pl-k">var</span> <span class="pl-s1">x</span> <span class="pl-c1">=</span> <span class="pl-kos">{</span><span class="pl-c1">o</span>: <span class="pl-c1">5</span><span class="pl-kos">,</span> <span class="pl-c1">o</span>: <span class="pl-c1">6</span><span class="pl-kos">}</span><span class="pl-kos">;</span></pre></div>
<p dir="auto">transpiles to</p>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="&quot;use strict&quot;;

var x = { o: 5, o: 6 };"><pre class="notranslate"><span class="pl-s">"use strict"</span><span class="pl-kos">;</span>

<span class="pl-k">var</span> <span class="pl-s1">x</span> <span class="pl-c1">=</span> <span class="pl-kos">{</span> <span class="pl-c1">o</span>: <span class="pl-c1">5</span><span class="pl-kos">,</span> <span class="pl-c1">o</span>: <span class="pl-c1">6</span> <span class="pl-kos">}</span><span class="pl-kos">;</span></pre></div>
<p dir="auto">which entirely fails to parse in some browsers.</p>
<p dir="auto">Could babel transpile code with duplicate properties in object literals as defining an object literal with no duplicate properties, and then assigning further properties, similar to how computed keys are handled? So that way</p>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="var x = {o: 5, o: 6};"><pre class="notranslate"><span class="pl-k">var</span> <span class="pl-s1">x</span> <span class="pl-c1">=</span> <span class="pl-kos">{</span><span class="pl-c1">o</span>: <span class="pl-c1">5</span><span class="pl-kos">,</span> <span class="pl-c1">o</span>: <span class="pl-c1">6</span><span class="pl-kos">}</span><span class="pl-kos">;</span></pre></div>
<p dir="auto">and</p>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="var x = {o: 5, [&quot;o&quot;]: 6};"><pre class="notranslate"><span class="pl-k">var</span> <span class="pl-s1">x</span> <span class="pl-c1">=</span> <span class="pl-kos">{</span><span class="pl-c1">o</span>: <span class="pl-c1">5</span><span class="pl-kos">,</span> <span class="pl-kos">[</span><span class="pl-s">"o"</span><span class="pl-kos">]</span>: <span class="pl-c1">6</span><span class="pl-kos">}</span><span class="pl-kos">;</span></pre></div>
<p dir="auto">would both transpile to the same following thing, which works in all browsers:</p>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="&quot;use strict&quot;;

function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

var x = _defineProperty({ o: 5 }, &quot;o&quot;, 6);"><pre class="notranslate"><span class="pl-s">"use strict"</span><span class="pl-kos">;</span>

<span class="pl-k">function</span> <span class="pl-en">_defineProperty</span><span class="pl-kos">(</span><span class="pl-s1">obj</span><span class="pl-kos">,</span> <span class="pl-s1">key</span><span class="pl-kos">,</span> <span class="pl-s1">value</span><span class="pl-kos">)</span> <span class="pl-kos">{</span> <span class="pl-k">if</span> <span class="pl-kos">(</span><span class="pl-s1">key</span> <span class="pl-k">in</span> <span class="pl-s1">obj</span><span class="pl-kos">)</span> <span class="pl-kos">{</span> <span class="pl-v">Object</span><span class="pl-kos">.</span><span class="pl-en">defineProperty</span><span class="pl-kos">(</span><span class="pl-s1">obj</span><span class="pl-kos">,</span> <span class="pl-s1">key</span><span class="pl-kos">,</span> <span class="pl-kos">{</span> <span class="pl-c1">value</span>: <span class="pl-s1">value</span><span class="pl-kos">,</span> <span class="pl-c1">enumerable</span>: <span class="pl-c1">true</span><span class="pl-kos">,</span> <span class="pl-c1">configurable</span>: <span class="pl-c1">true</span><span class="pl-kos">,</span> <span class="pl-c1">writable</span>: <span class="pl-c1">true</span> <span class="pl-kos">}</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-kos">}</span> <span class="pl-k">else</span> <span class="pl-kos">{</span> <span class="pl-s1">obj</span><span class="pl-kos">[</span><span class="pl-s1">key</span><span class="pl-kos">]</span> <span class="pl-c1">=</span> <span class="pl-s1">value</span><span class="pl-kos">;</span> <span class="pl-kos">}</span> <span class="pl-k">return</span> <span class="pl-s1">obj</span><span class="pl-kos">;</span> <span class="pl-kos">}</span>

<span class="pl-k">var</span> <span class="pl-s1">x</span> <span class="pl-c1">=</span> <span class="pl-en">_defineProperty</span><span class="pl-kos">(</span><span class="pl-kos">{</span> <span class="pl-c1">o</span>: <span class="pl-c1">5</span> <span class="pl-kos">}</span><span class="pl-kos">,</span> <span class="pl-s">"o"</span><span class="pl-kos">,</span> <span class="pl-c1">6</span><span class="pl-kos">)</span><span class="pl-kos">;</span></pre></div>
<p dir="auto">The following ES6 code:</p>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="var x = {x: 1, x: 2};"><pre class="notranslate"><span class="pl-k">var</span> <span class="pl-s1">x</span> <span class="pl-c1">=</span> <span class="pl-kos">{</span><span class="pl-c1">x</span>: <span class="pl-c1">1</span><span class="pl-kos">,</span> <span class="pl-c1">x</span>: <span class="pl-c1">2</span><span class="pl-kos">}</span><span class="pl-kos">;</span></pre></div>
<p dir="auto">generates the following code:</p>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="&quot;use strict&quot;;

var x = { x: 1, x: 2 };"><pre class="notranslate"><span class="pl-s">"use strict"</span><span class="pl-kos">;</span>

<span class="pl-k">var</span> <span class="pl-s1">x</span> <span class="pl-c1">=</span> <span class="pl-kos">{</span> <span class="pl-c1">x</span>: <span class="pl-c1">1</span><span class="pl-kos">,</span> <span class="pl-c1">x</span>: <span class="pl-c1">2</span> <span class="pl-kos">}</span><span class="pl-kos">;</span></pre></div>
<p dir="auto">which will result in an error for ES5-compliant engines. I'm not sure what should be done here instead as duplicate keys are back to being valid in strict mode in ES6, but maybe something like this:</p>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="&quot;use strict&quot;;

var x = { x: 1 };
x.x = 2;"><pre class="notranslate"><span class="pl-s">"use strict"</span><span class="pl-kos">;</span>

<span class="pl-k">var</span> <span class="pl-s1">x</span> <span class="pl-c1">=</span> <span class="pl-kos">{</span> <span class="pl-c1">x</span>: <span class="pl-c1">1</span> <span class="pl-kos">}</span><span class="pl-kos">;</span>
<span class="pl-s1">x</span><span class="pl-kos">.</span><span class="pl-c1">x</span> <span class="pl-c1">=</span> <span class="pl-c1">2</span><span class="pl-kos">;</span></pre></div>
<p dir="auto">This bug also occurs with JSX:</p>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="var x = &lt;x x={1} x={2} /&gt;;"><pre class="notranslate"><span class="pl-k">var</span> <span class="pl-s1">x</span> <span class="pl-c1">=</span> <span class="pl-c1">&lt;</span><span class="pl-s1">x</span> <span class="pl-c1">x</span><span class="pl-c1">=</span><span class="pl-kos">{</span><span class="pl-c1">1</span><span class="pl-kos">}</span> <span class="pl-c1">x</span><span class="pl-c1">=</span><span class="pl-kos">{</span><span class="pl-c1">2</span><span class="pl-kos">}</span> <span class="pl-c1">/</span><span class="pl-c1">&gt;</span><span class="pl-kos">;</span></pre></div>
<p dir="auto">becomes</p>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="&quot;use strict&quot;;

var x = React.createElement(&quot;x&quot;, { x: 1, x: 2 });"><pre class="notranslate"><span class="pl-s">"use strict"</span><span class="pl-kos">;</span>

<span class="pl-k">var</span> <span class="pl-s1">x</span> <span class="pl-c1">=</span> <span class="pl-v">React</span><span class="pl-kos">.</span><span class="pl-en">createElement</span><span class="pl-kos">(</span><span class="pl-s">"x"</span><span class="pl-kos">,</span> <span class="pl-kos">{</span> <span class="pl-c1">x</span>: <span class="pl-c1">1</span><span class="pl-kos">,</span> <span class="pl-c1">x</span>: <span class="pl-c1">2</span> <span class="pl-kos">}</span><span class="pl-kos">)</span><span class="pl-kos">;</span></pre></div>