<p dir="auto">Choose one: is this a bug report or feature request? Bug</p>
<p dir="auto">Given a rest property inside an object destructuring, Babel generates member expressions to access the inner object incorrectly.</p>

<h3 dir="auto">Input Code</h3>


<p dir="auto"><strong>Gist:</strong> <a href="https://gist.github.com/also/578b123c2be5aecc53f7fd79c9547313">https://gist.github.com/also/578b123c2be5aecc53f7fd79c9547313</a></p>
<p dir="auto"><strong>Repl:</strong> <a href="https://babeljs.io/repl/#?babili=false&amp;evaluate=true&amp;lineWrap=false&amp;presets=stage-3&amp;targets=&amp;browsers=&amp;builtIns=false&amp;debug=false&amp;code=const%20o%20%3D%20%7Ba%3A%20%7Bb%3A%20%7Bc%3A%20%7Bd%3A%20%7Bx%3A%201%2C%20y%3A%202%2C%20z%3A%203%7D%7D%7D%7D%7D%3B%0A%0Afunction%20works()%20%7B%0A%20%20const%20%7Ba%3A%20%7Bb%3A%20%7Bc%3A%20%7Bd%3A%20temp%7D%7D%7D%7D%20%3D%20o%3B%0A%20%20const%20%7Bx%2C%20y%2C%20...rest%7D%20%3D%20temp%3B%0A%20%20return%20rest%3B%0A%7D%0A%0Afunction%20broken()%20%7B%0A%20%20const%20%7Ba%3A%20%7Bb%3A%20%7Bc%3A%20%7Bd%3A%20%7Bx%2C%20y%2C%20...rest%7D%7D%7D%7D%7D%20%3D%20o%3B%0A%20%20return%20rest%3B%0A%7D%0A%0Aconsole.log(works())%3B%0Aconsole.log(broken())%3B%0A" rel="nofollow">https://babeljs.io/repl/#?babili=false&amp;evaluate=true&amp;lineWrap=false&amp;presets=stage-3&amp;targets=&amp;browsers=&amp;builtIns=false&amp;debug=false&amp;code=const%20o%20%3D%20%7Ba%3A%20%7Bb%3A%20%7Bc%3A%20%7Bd%3A%20%7Bx%3A%201%2C%20y%3A%202%2C%20z%3A%203%7D%7D%7D%7D%7D%3B%0A%0Afunction%20works()%20%7B%0A%20%20const%20%7Ba%3A%20%7Bb%3A%20%7Bc%3A%20%7Bd%3A%20temp%7D%7D%7D%7D%20%3D%20o%3B%0A%20%20const%20%7Bx%2C%20y%2C%20...rest%7D%20%3D%20temp%3B%0A%20%20return%20rest%3B%0A%7D%0A%0Afunction%20broken()%20%7B%0A%20%20const%20%7Ba%3A%20%7Bb%3A%20%7Bc%3A%20%7Bd%3A%20%7Bx%2C%20y%2C%20...rest%7D%7D%7D%7D%7D%20%3D%20o%3B%0A%20%20return%20rest%3B%0A%7D%0A%0Aconsole.log(works())%3B%0Aconsole.log(broken())%3B%0A</a><br>
Note that when testing in the repl, the bug is only apparent when es2015 is disabled, because es2015 compiles away the destructuring.</p>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="const {a: {b: {c: {d: {x, y, ...rest}}}}} = o;"><pre class="notranslate"><span class="pl-k">const</span> <span class="pl-kos">{</span><span class="pl-c1">a</span>: <span class="pl-kos">{</span><span class="pl-c1">b</span>: <span class="pl-kos">{</span><span class="pl-c1">c</span>: <span class="pl-kos">{</span><span class="pl-c1">d</span>: <span class="pl-kos">{</span>x<span class="pl-kos">,</span> y<span class="pl-kos">,</span> ...<span class="pl-s1">rest</span><span class="pl-kos">}</span><span class="pl-kos">}</span><span class="pl-kos">}</span><span class="pl-kos">}</span><span class="pl-kos">}</span> <span class="pl-c1">=</span> <span class="pl-s1">o</span><span class="pl-kos">;</span></pre></div>
<h3 dir="auto">Babel Configuration (.babelrc, package.json, cli command)</h3>

<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="{
  &quot;plugins&quot;: [
    &quot;transform-object-rest-spread&quot;
  ]
}"><pre class="notranslate"><span class="pl-kos">{</span>
  <span class="pl-s">"plugins"</span>: <span class="pl-kos">[</span>
    <span class="pl-s">"transform-object-rest-spread"</span>
  <span class="pl-kos">]</span>
<span class="pl-kos">}</span></pre></div>
<h3 dir="auto">Expected Behavior</h3>
<p dir="auto">Babel should apply the <code class="notranslate">_objectWithoutProperties</code> helper to <code class="notranslate">o.a.b.c.d</code>.</p>


<h3 dir="auto">Current Behavior</h3>
<p dir="auto">The generated member expressions <code class="notranslate">o.d.c.b.a</code> for the destructuring are backwards:</p>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="const { a: { b: { c: { d: { x, y } } } } } = o,
      rest = _objectWithoutProperties(o.d.c.b.a, [&quot;x&quot;, &quot;y&quot;]);"><pre class="notranslate"><span class="pl-k">const</span> <span class="pl-kos">{</span> <span class="pl-c1">a</span>: <span class="pl-kos">{</span> <span class="pl-c1">b</span>: <span class="pl-kos">{</span> <span class="pl-c1">c</span>: <span class="pl-kos">{</span> <span class="pl-c1">d</span>: <span class="pl-kos">{</span> x<span class="pl-kos">,</span> y <span class="pl-kos">}</span> <span class="pl-kos">}</span> <span class="pl-kos">}</span> <span class="pl-kos">}</span> <span class="pl-kos">}</span> <span class="pl-c1">=</span> <span class="pl-s1">o</span><span class="pl-kos">,</span>
      <span class="pl-s1">rest</span> <span class="pl-c1">=</span> <span class="pl-en">_objectWithoutProperties</span><span class="pl-kos">(</span><span class="pl-s1">o</span><span class="pl-kos">.</span><span class="pl-c1">d</span><span class="pl-kos">.</span><span class="pl-c1">c</span><span class="pl-kos">.</span><span class="pl-c1">b</span><span class="pl-kos">.</span><span class="pl-c1">a</span><span class="pl-kos">,</span> <span class="pl-kos">[</span><span class="pl-s">"x"</span><span class="pl-kos">,</span> <span class="pl-s">"y"</span><span class="pl-kos">]</span><span class="pl-kos">)</span><span class="pl-kos">;</span></pre></div>
<p dir="auto">Choose one: is this a bug report or feature request?</p>
<p dir="auto">Bug</p>

<h3 dir="auto">Input Code</h3>


<p dir="auto"><a href="https://github.com/daerion/babel-rest-spread-bug">https://github.com/daerion/babel-rest-spread-bug</a></p>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="const defunct = {
  outer: {
    inner: {
      three: 'three',
      four: 'four'
    }
  }
}

const { outer: { inner: { three, ...other } } } = defunct"><pre class="notranslate"><span class="pl-k">const</span> <span class="pl-s1">defunct</span> <span class="pl-c1">=</span> <span class="pl-kos">{</span>
  <span class="pl-c1">outer</span>: <span class="pl-kos">{</span>
    <span class="pl-c1">inner</span>: <span class="pl-kos">{</span>
      <span class="pl-c1">three</span>: <span class="pl-s">'three'</span><span class="pl-kos">,</span>
      <span class="pl-c1">four</span>: <span class="pl-s">'four'</span>
    <span class="pl-kos">}</span>
  <span class="pl-kos">}</span>
<span class="pl-kos">}</span>

<span class="pl-k">const</span> <span class="pl-kos">{</span> <span class="pl-c1">outer</span>: <span class="pl-kos">{</span> <span class="pl-c1">inner</span>: <span class="pl-kos">{</span> three<span class="pl-kos">,</span> ...<span class="pl-s1">other</span> <span class="pl-kos">}</span> <span class="pl-kos">}</span> <span class="pl-kos">}</span> <span class="pl-c1">=</span> <span class="pl-s1">defunct</span></pre></div>
<h3 dir="auto">Babel Configuration (.babelrc, package.json, cli command)</h3>

<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="{
  &quot;plugins&quot;: [
    [ &quot;transform-object-rest-spread&quot; ]
  ]
}"><pre class="notranslate"><span class="pl-kos">{</span>
  <span class="pl-s">"plugins"</span>: <span class="pl-kos">[</span>
    <span class="pl-kos">[</span> <span class="pl-s">"transform-object-rest-spread"</span> <span class="pl-kos">]</span>
  <span class="pl-kos">]</span>
<span class="pl-kos">}</span></pre></div>
<h3 dir="auto">Expected Behavior</h3>
<p dir="auto">Using the above example, two constants should be assigned:</p>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="console.log('three: %s', three) // 'three'
console.dir(other) // { four: 'four' }"><pre class="notranslate"><span class="pl-smi">console</span><span class="pl-kos">.</span><span class="pl-en">log</span><span class="pl-kos">(</span><span class="pl-s">'three: %s'</span><span class="pl-kos">,</span> <span class="pl-s1">three</span><span class="pl-kos">)</span> <span class="pl-c">// 'three'</span>
<span class="pl-smi">console</span><span class="pl-kos">.</span><span class="pl-en">dir</span><span class="pl-kos">(</span><span class="pl-s1">other</span><span class="pl-kos">)</span> <span class="pl-c">// { four: 'four' }</span></pre></div>
<p dir="auto">Or, more explicitly, <code class="notranslate">other</code> should be an object containing all values from <code class="notranslate">defunct.outer.inner</code> except for <code class="notranslate">three</code>.</p>


<h3 dir="auto">Current Behavior</h3>


<p dir="auto">Transpiling the above code results in the following (declarations omitted for brevity, see repository linked above for full source):</p>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="const { outer: { inner: { three } } } = defunct,
      other = _objectWithoutProperties(defunct.inner.outer, ['three']);"><pre class="notranslate"><span class="pl-k">const</span> <span class="pl-kos">{</span> <span class="pl-c1">outer</span>: <span class="pl-kos">{</span> <span class="pl-c1">inner</span>: <span class="pl-kos">{</span> three <span class="pl-kos">}</span> <span class="pl-kos">}</span> <span class="pl-kos">}</span> <span class="pl-c1">=</span> <span class="pl-s1">defunct</span><span class="pl-kos">,</span>
      <span class="pl-s1">other</span> <span class="pl-c1">=</span> <span class="pl-en">_objectWithoutProperties</span><span class="pl-kos">(</span><span class="pl-s1">defunct</span><span class="pl-kos">.</span><span class="pl-c1">inner</span><span class="pl-kos">.</span><span class="pl-c1">outer</span><span class="pl-kos">,</span> <span class="pl-kos">[</span><span class="pl-s">'three'</span><span class="pl-kos">]</span><span class="pl-kos">)</span><span class="pl-kos">;</span></pre></div>
<p dir="auto">I.e. instead of constructing <code class="notranslate">other</code> from <code class="notranslate">defunct.outer.inner</code>, babel will attempt to use <code class="notranslate">defunct.inner.outer</code>, which is undefined. This happens also when nesting objects even further (again, see linked repo).</p>
<h3 dir="auto">Your Environment</h3>

<table role="table">
<thead>
<tr>
<th>software</th>
<th>version(s)</th>
</tr>
</thead>
<tbody>
<tr>
<td>Babel</td>
<td><code class="notranslate">6.24.1</code></td>
</tr>
<tr>
<td>transform-object-rest-spread</td>
<td><code class="notranslate">6.23.0</code></td>
</tr>
<tr>
<td>node</td>
<td><code class="notranslate">7.9.0</code> and <code class="notranslate">6.10.2</code></td>
</tr>
<tr>
<td>npm</td>
<td><code class="notranslate">4.2.0</code> and <code class="notranslate">3.10.10</code></td>
</tr>
<tr>
<td>Operating System</td>
<td>Ubuntu 16.10</td>
</tr>
</tbody>
</table>