Fix add component buttons to be backward compatible

cms/static/js/spec/views/pages/container_spec.js

@@ -574,6 +574,25 @@ define(["jquery", "underscore", "underscore.string", "common/js/spec_helpers/aja
                             });
                         });
 
+                        it('also works for older-style add component links', function () {
+                            // Some third party xblocks (problem-builder in particular) expect add
+                            // event handlers on custom <a> add buttons which is what the platform
+                            // used to use instead of <button>s.
+                            // This can be removed once there is a proper API that XBlocks can use
+                            // to add children or allow authors to add children.
+                            renderContainerPage(this, mockContainerXBlockHtml);
+                            $(".add-xblock-component-button").each(function() {
+                                var htmlAsLink = $($(this).prop('outerHTML').replace(/(<\/?)button/g, "$1a"));
+                                $(this).replaceWith(htmlAsLink);
+                            });
+                            $(".add-xblock-component-button").first().click();
+                            EditHelpers.verifyXBlockRequest(requests, {
+                                "category": "discussion",
+                                "type": "discussion",
+                                "parent_locator": "locator-group-A"
+                            });
+                        });
+
                         it('shows a notification while creating', function () {
                             var notificationSpy = EditHelpers.createNotificationSpy();
                             renderContainerPage(this, mockContainerXBlockHtml);

cms/static/js/views/components/add_xblock.js

@@ -6,8 +6,8 @@ define(["jquery", "underscore", "gettext", "js/views/baseview", "common/js/compo
     function ($, _, gettext, BaseView, ViewUtils, AddXBlockButton, AddXBlockMenu) {
         var AddXBlockComponent = BaseView.extend({
             events: {
-                'click .new-component .new-component-type button.multiple-templates': 'showComponentTemplates',
-                'click .new-component .new-component-type button.single-template': 'createNewComponent',
+                'click .new-component .new-component-type .multiple-templates': 'showComponentTemplates',
+                'click .new-component .new-component-type .single-template': 'createNewComponent',
                 'click .new-component .cancel-button': 'closeNewComponent',
                 'click .new-component-templates .new-component-template .button-component': 'createNewComponent',
                 'click .new-component-templates .cancel-button': 'closeNewComponent'