allow overwriting a registered component

Author: Feiyang1

packages/app/src/firebaseApp.ts

@@ -144,9 +144,16 @@ export class FirebaseAppImpl implements FirebaseApp {
     this.container.getProvider(name).clearInstance(instanceIdentifier);
   }
 
-  _addComponent(component: Component): void {
+  /**
+   * 
+   * @param component the component being added to this app's container
+   * @param overwrite When a component with the same name has already been registered,
+   * if overwrite is true: overwrite the existing component
+   * if overwrite is false: throw an expection
+   */
+  _addComponent(component: Component, overwrite = false): void {
     try {
-      this.container.addComponent(component);
+      this.container.addComponent(component, overwrite);
     } catch (e) {
       logger.debug(
         `Component ${component.name} failed to register with FirebaseApp ${this.name}`,

packages/component/src/component_container.test.ts

@@ -55,7 +55,7 @@ describe('Component Container', () => {
     expect(setComponentStub).has.been.calledWith(component);
   });
 
-  it('throws when registering multiple components with the same name', () => {
+  it('throws when registering multiple components with the same name, when overwrite is false', () => {
     const component1 = getFakeComponent(
       'fireball',
       () => ({}),
@@ -74,4 +74,47 @@ describe('Component Container', () => {
       /Component fireball has already been registered with/
     );
   });
+
+  it('does not throw when registering multiple components with the same name, when overwrite is true', () => {
+    const component1 = getFakeComponent(
+      'fireball',
+      () => ({}),
+      true,
+      InstantiationMode.EAGER
+    );
+    const component2 = getFakeComponent(
+      'fireball',
+      () => ({ test: true }),
+      false,
+      InstantiationMode.LAZY
+    );
+
+    expect(() => container.addComponent(component1)).to.not.throw();
+    expect(() => container.addComponent(component2, true)).to.not.throw();
+  });
+
+  it('registers a component with a name that is already registered and return the provider for the new component', () => {
+    const component1 = getFakeComponent(
+      'fireball',
+      () => ({ test: false }),
+      true,
+      InstantiationMode.EAGER
+    );
+    const component2 = getFakeComponent(
+      'fireball',
+      () => ({ test: true }),
+      false,
+      InstantiationMode.LAZY
+    );
+
+    container.addComponent(component1);
+    const oldProvider = container.getProvider('fireball');
+    expect(oldProvider.getImmediate()).to.deep.eq({ test: false });
+
+    container.addComponent(component2, true);
+    const newProvider = container.getProvider('fireball');
+    expect(oldProvider).to.not.eq(newProvider);
+    expect(newProvider.getImmediate()).to.deep.eq({ test: true });
+
+  });
 });

packages/component/src/component_container.ts

@@ -21,14 +21,28 @@ import { Component } from './component';
 export class ComponentContainer {
   private providers = new Map<string, Provider>();
 
-  constructor(private name: string) {}
+  constructor(private name: string) { }
 
-  addComponent(component: Component): void {
-    const provider = this.getProvider(component.name);
+  /**
+   * 
+   * @param component Component being added
+   * @param overwrite When a component with the same name has already been registered,
+   * if overwrite is true: overwrite the existing component with the new component and create a new provider with the new component
+   * if overwrite is false: throw an expection
+   */
+  addComponent(component: Component, overwrite = false): void {
+    let provider = this.getProvider(component.name);
     if (provider.isComponentSet()) {
-      throw new Error(
-        `Component ${component.name} has already been registered with ${this.name}`
-      );
+      if (!overwrite) {
+        throw new Error(
+          `Component ${component.name} has already been registered with ${this.name}`
+        );
+      } else { // use the new component to replace the existing component
+        // delete the existing provider from the container
+        this.providers.delete(component.name);
+        // create a new provider
+        provider  = this.getProvider(component.name);
+      }
     }
 
     provider.setComponent(component);