define(
  ['apres', 'jquery'],
  function(apres, $) {
    var SauceConfigWidget = function(elem, params) {
      var params = apres.controller().params;

      function message(message, classes) {
        elem.find("div.alert").removeClass().addClass("alert " + classes).html(message).show();
      }

      function message_hide() {
        elem.find("div.alert").hide();
      }

      function load(url) {
        elem.find('.details').addClass('hide');
        elem.find('.alert').removeClass().addClass("alert alert-info").html("Loading ...");
        $.ajax({
          url: "/api/sauce",
          type: "GET",
          data: {url: url},
          dataType: "json",
          success: function (data, ts, xhr) {
            setBrowsers(data.results.sauce_browsers);
            elem.find('.sauce-username').val(data.results.sauce_username);
            elem.find('.sauce-access-key').val(data.results.sauce_access_key);
            elem.find('.details').show();
            message_hide();
          },
          error: function(xhr, ts, e) {
            if (xhr && xhr.responseText) {
                var data = $.parseJSON(xhr.responseText);
                message("Error loading Sauce config: " + data.errors[0], "alert-error");
            } else {
                message("Error loading Sauce config: " + e, "alert-error");
            }
          }

        });
      }

      function getBrowsers() {
        var checked = elem.find("input:checked");
        var sauceBrowsers = [];
        for (var i = 0; i < checked.length; i++) {
          var str = $(checked[i]).val();
          var parts = str.split('-');
          var platform = parts[0];
          var browser = parts[1];
          var browserVerson = parts[2] || '';
          sauceBrowsers.push({
            platform: platform,
            browserName: browser,
            version: browserVerson
          });
        }
        return sauceBrowsers;
      }

      function setBrowsers(sauceBrowsers) {
        for (var i = 0; i < sauceBrowsers.length; i++) {
          var o = sauceBrowsers[i];
          var searchValue = o.platform + "-" + o.browserName + "-" + o.version;
          elem.find("input[value='"+searchValue+"']").attr('checked', 'checked');
        }

      }
      
      this.events = {
        "click #sauce-save": function() {
          var sauce_browsers = getBrowsers();
          var sauce_username = elem.find(".sauce-username").val();
          var sauce_access_key = elem.find(".sauce-access-key").val();
          $.ajax("/api/sauce", {
                data: {
                  url:params.repo_url,
                  sauce_username:sauce_username,
                  sauce_access_key:sauce_access_key,
                  sauce_browsers: JSON.stringify(sauce_browsers)
                },
                error: function(xhr, ts, e) {
                  console.log(e);
                  message("Error saving sauce credentials.", "alert-error");
                },
                success: function(data, ts, xhr) {
                  message("Sauce credentials saved.", "alert-success");
                },
                type: "POST",
          });
        },
      };
      // There is a global "repo" object which is generated by the server
      var repo_url = apres.controller().params.repo_url;
      load(repo_url);
      
    };

    return SauceConfigWidget;
  }
);

@@ -725,28 +725,31 @@
         
-setB
+var b
 rowsers
-(
+ = 
 data.res
@@ -767,16 +767,56 @@
 browsers
+ %7C%7C %5B%5D;%0A            setBrowsers(browsers
 );%0A     

handle missing browsers