Polymer 2 CLI ES5 bundle Chrome issue

I am working on a Polymer 2 elements project and would to produce a bundled html file I can import into other pages. For bundling I am using the Polymer2 CLI.

The problem I am running into is that the bundled file is causing errors in Chrome. The unbundled version works fine in both FireFox and Chrome, and the bundled version works fine in FireFox.

After bundling Chrome is returning the following error:

Uncaught TypeError: Failed to construct 'HTMLElement': Please use the 'new' operator, this DOM object constructor cannot be called as a function.

It seems to be a problem that occurred in the ES6->ES5 compile step, because the error is being thrown here:

babelHelpers.possibleConstructorReturn(
    this,
    (g.__proto__ || Object.getPrototypeOf(g)).apply(this, arguments)
)

I was able to reproduce the problem in a very simple setup, with this basic folder structure:

root
|
|__index.html       // File that will import the bundle
|
|__polymer-elements
    |
    |__index.html   // File that imports all Polymer elements
    |
    |__polymer.json 
    |
    |__src
        |
        |_el-1.html
        |
        |_el-2.html
        |
        |_el-3.html

polymer-elements/index.html

<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, minimum-scale=1, initial-scale=1, user-scalable=yes">

    <title>polymer-test</title>
    <meta name="description" content="polymer-test description">
    <link rel="import" href="src/el-1.html">
    <link rel="import" href="src/el-2.html">
    <link rel="import" href="src/el-3.html">
  </head>
  <body>
  </body>
</html>

polymer-elements/polymer.json

{
  "entrypoint": "index.html",
  "fragments": [],
  "sources": [
    "src/**/*",
    "index.html"
  ],
  "extraDependencies": [
    "bower_components/webcomponentsjs/*.js"
  ],
  "builds": [
    {
      "name": "es5-bundled",
      "bundle": true,
      "js": {
        "compile": true,
        "minify": true
      },
      "css": {
        "minify": true
      },
      "html": {
        "minify": true
      },
      "addServiceWorker": false,
      "addPushManifest": false,
      "insertPrefetchLinks": false
    }
  ],
  "lint": {
    "rules": [
      "polymer-2"
    ]
  }
}

When I run Polymer build from directory polymer-elements a bundle is produced in build/es5-bundled/index.html. I then include the bundle like so:

index.html (root)

<!DOCTYPE html>
<html lang="en">
  <head>
    <title></title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <script src="polymer-elements/bower_components/webcomponentsjs/webcomponents-loader.js"></script>
    <!-- THE BUNDLED VERSION IS CAUSING ISSUES IN CHROME  -->
    <link rel="import" href="polymer-elements/build/es5-bundled/index.html"> 
    <!-- USING THE UNBUNDLED VERSION WOULD WORK FINE  -->
    <!-- <link rel="import" href="polymer-elements/index.html">  -->
  </head>
  <body>
    <el-1></el-1>
    <el-2></el-2>
    <el-3></el-3>
  </body>
</html>

Is there a problem with my setup, or is this some sort of bug in the compilation process?

UPDATE 1 Interestingly, when I add the script reference for /webcomponents-loader.js into polymer-elements/index.html and remove it from the root index, I see that Chrome is working as expected but FireFox is failing (just not rendering the Polymer element without an error).

UPDATE 2 The underlying issue seems to be this one... https://github.com/babel/babel/issues/4480 When I set compile: false (to skip the babel transpile step) the setup above works in Chrome and FireFox, but would obviously fail in IE....

UPDATE 3 I managed to solve the problem by including the custom-elements-es5-adapter.js shim to the root index. I don't really understand why this was needed though, because the polymer-cli build process was already injecting this script. Any explanation would be appreciated.

A working example below: index.html (root)

<!DOCTYPE html>
<html lang="en">
  <head>
    <title></title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <script src="polymer-elements/bower_components/webcomponentsjs/custom-elements-es5-adapter.js"></script> 
    <script src="polymer-elements/bower_components/webcomponentsjs/webcomponents-loader.js"></script>
    <link rel="import" href="polymer-elements/build/es5-bundled/index.html"> 
  </head>
  <body>
    <el-1></el-1>
    <el-2></el-2>
    <el-3></el-3>
  </body>
</html>