Components are now accessible via camelCase and UpperCamelCase me…

…ans.

- addChild
- getChild
- getComponent
- registerComponent

src/js/component.js

@@ -306,6 +306,12 @@ class Component {
    * @method getChild
    */
   getChild(name) {
+    if (!name) {
+      return;
+    }
+
+    name = toTitleCase(name);
+
     return this.childNameIndex_[name];
   }
 
@@ -343,7 +349,7 @@ class Component {
 
     // If child is a string, create nt with options
     if (typeof child === 'string') {
-      componentName = child;
+      componentName = toTitleCase(child);
 
       // Options can also be specified as a boolean, so convert to an empty object if false.
       if (!options) {
@@ -1386,11 +1392,18 @@ class Component {
    * @method registerComponent
    */
   static registerComponent(name, comp) {
+    if (!name) {
+      return;
+    }
+
+    name = toTitleCase(name);
+
     if (!Component.components_) {
       Component.components_ = {};
     }
 
     Component.components_[name] = comp;
+
     return comp;
   }
 
@@ -1403,12 +1416,19 @@ class Component {
    * @method getComponent
    */
   static getComponent(name) {
+    if (!name) {
+      return;
+    }
+
+    name = toTitleCase(name);
+
     if (Component.components_ && Component.components_[name]) {
       return Component.components_[name];
     }
 
     if (window && window.videojs && window.videojs[name]) {
       log.warn(`The ${name} component was added to the videojs object when it should be registered using videojs.registerComponent(name, component)`);
+
       return window.videojs[name];
     }
   }

src/js/utils/to-title-case.js

@@ -9,6 +9,10 @@
  * @method toTitleCase
  */
 function toTitleCase(string) {
+  if (typeof string !== 'string') {
+    return string;
+  }
+
   return string.charAt(0).toUpperCase() + string.slice(1);
 }
 

test/unit/component.test.js

@@ -99,6 +99,18 @@ QUnit.test('addChild should throw if the child does not exist', function(assert)
 
 });
 
+QUnit.test('should add a child component with title case name', function(assert) {
+  const comp = new Component(getFakePlayer());
+
+  const child = comp.addChild('Component');
+
+  assert.ok(comp.children().length === 1);
+  assert.ok(comp.children()[0] === child);
+  assert.ok(comp.el().childNodes[0] === child.el());
+  assert.ok(comp.getChild('Component') === child);
+  assert.ok(comp.getChildById(child.id()) === child);
+});
+
 QUnit.test('should init child components from options', function(assert) {
   const comp = new Component(getFakePlayer(), {
     children: {