Making domElementGetter optional. Upgrading dependencies.

.babelrc

@@ -1,7 +1,8 @@
 {
-  "presets": ["es2015"],
+  "presets": [
+    "@babel/preset-env",
+  ],
   "plugins": [
-    "transform-object-rest-spread",
-    "transform-es2015-modules-umd",
+    "@babel/plugin-transform-modules-umd",
   ],
 }

package.json

@@ -5,7 +5,7 @@
   "main": "lib/single-spa-angularjs.js",
   "scripts": {
     "build": "rimraf lib && babel src --out-dir lib --source-maps",
-    "prepublish": "npm run build"
+    "prepublishOnly": "yarn build"
   },
   "repository": {
     "type": "git",
@@ -24,10 +24,11 @@
   },
   "homepage": "https://github.com/joeldenning/single-spa-angularjs#readme",
   "devDependencies": {
-    "babel-cli": "^6.18.0",
-    "babel-plugin-transform-es2015-modules-umd": "^6.24.1",
-    "babel-plugin-transform-object-rest-spread": "^6.19.0",
-    "babel-preset-es2015": "^6.18.0",
+    "@babel/cli": "^7.5.5",
+    "@babel/core": "^7.5.5",
+    "@babel/plugin-transform-modules-umd": "^7.2.0",
+    "@babel/preset-env": "^7.5.5",
     "rimraf": "^2.6.2"
-  }
+  },
+  "dependencies": {}
 }

src/single-spa-angularjs.js

@@ -26,8 +26,8 @@ export default function singleSpaAngularJS(userOpts) {
     throw new Error(`single-spa-angularjs must be passed opts.angular`);
   }
 
-  if (!opts.domElementGetter) {
-    throw new Error(`single-spa-angularjs must be passed opts.domElementGetter function`);
+  if (opts.domElementGetter && typeof opts.domElementGetter !== 'function') {
+    throw new Error(`single-spa-angularjs opts.domElementGetter must be a function`);
   }
 
   if (!opts.mainAngularModule) {
@@ -48,13 +48,13 @@ function bootstrap(opts) {
   return Promise.resolve();
 }
 
-function mount(opts, mountedInstances) {
+function mount(opts, mountedInstances, props = {}) {
   return Promise
     .resolve()
     .then(() => {
       window.angular = opts.angular;
 
-      const containerEl = getContainerEl(opts);
+      const containerEl = getContainerEl(opts, props);
       const bootstrapEl = document.createElement('div');
       bootstrapEl.id = opts.elementId;
 
@@ -78,10 +78,10 @@ function mount(opts, mountedInstances) {
   });
 }
 
-function unmount(opts, mountedInstances) {
+function unmount(opts, mountedInstances, props = {}) {
   return new Promise((resolve, reject) => {
     mountedInstances.instance.get('$rootScope').$destroy();
-    getContainerEl(opts).innerHTML = '';
+    getContainerEl(opts, props).innerHTML = '';
 
     if (opts.angular === window.angular && !opts.preserveGlobal)
       delete window.angular;
@@ -90,8 +90,20 @@ function unmount(opts, mountedInstances) {
   });
 }
 
-function getContainerEl(opts) {
-  const element = opts.domElementGetter();
+function getContainerEl(opts, props) {
+  let element;
+  if (opts.domElementGetter) {
+    element = opts.domElementGetter()
+  } else {
+    const htmlId = `single-spa-application:${props.name || props.appName}`
+    element = document.getElementById(htmlId)
+    if (!element) {
+      element = document.createElement('div')
+      element.id = htmlId
+      document.body.appendChild(element)
+    }
+  }
+
   if (!element) {
     throw new Error(`domElementGetter did not return a valid dom element`);
   }