Making sure that the title element gets placed into the UL element

Included are two sanity check tests for the two areas being checked
to make sure that the menu title items are being correctly placed
in the actual UL element of the menu.

Fixes #1107

src/js/menu.js

@@ -129,7 +129,7 @@ vjs.MenuButton.prototype.createMenu = function(){
 
   // Add a title list item to the top
   if (this.options().title) {
-    menu.el().appendChild(vjs.createEl('li', {
+    menu.contentEl().appendChild(vjs.createEl('li', {
       className: 'vjs-menu-title',
       innerHTML: vjs.capitalize(this.kind_),
       tabindex: -1

src/js/tracks.js

@@ -948,7 +948,7 @@ vjs.ChaptersButton.prototype.createMenu = function(){
 
   var menu = this.menu = new vjs.Menu(this.player_);
 
-  menu.el_.appendChild(vjs.createEl('li', {
+  menu.contentEl().appendChild(vjs.createEl('li', {
     className: 'vjs-menu-title',
     innerHTML: vjs.capitalize(this.kind_),
     tabindex: -1

test/index.html

@@ -33,7 +33,9 @@
         'test/unit/poster.js',
         'test/unit/plugins.js',
         'test/unit/flash.js',
-        'test/unit/api.js'
+        'test/unit/api.js',
+        'test/unit/menu.js',
+        'test/unit/tracks.js'
       ];
 
       var projectRoot = '../';

test/unit/menu.js

@@ -0,0 +1,20 @@
+module('MenuButton');
+
+test('should place title list item into ul', function() {
+  var player, menuButton;
+
+  player = PlayerTest.makePlayer();
+
+  vjs.MenuButton.prototype.kind_ = 'testTitle';
+
+  menuButton = new vjs.MenuButton(player, {
+    'title': true
+  });
+
+  var menuContentElement = menuButton.el().getElementsByTagName('UL')[0];
+  var titleElement = menuContentElement.children[0];
+
+  ok(titleElement.innerHTML === 'TestTitle', 'title element placed in ul');
+
+  player.dispose();
+});

test/unit/tracks.js

@@ -0,0 +1,16 @@
+module('Tracks');
+
+test('should place title list item into ul', function() {
+  var player, chaptersButton;
+
+  player = PlayerTest.makePlayer();
+
+  chaptersButton = new vjs.ChaptersButton(player);
+
+  var menuContentElement = chaptersButton.el().getElementsByTagName('UL')[0];
+  var titleElement = menuContentElement.children[0];
+
+  ok(titleElement.innerHTML === 'Chapters', 'title element placed in ul');
+
+  player.dispose();
+});