discourse/test/javascripts/components/logo_component_test.js

149 lines
4.1 KiB
JavaScript

var view, oldMobileView;
var View = Ember.View.extend({
template: Ember.Handlebars.compile("{{discourse-logo minimized=view.minimized}}")
});
var setSmallLogoUrl = function(url) {
Discourse.SiteSettings.logo_small_url = url;
};
var setBigLogoUrl = function(url) {
Discourse.SiteSettings.logo_url = url;
};
var setTitle = function(title) {
Discourse.SiteSettings.title = title;
};
var setMobileView = function(value) {
Discourse.Mobile.mobileView = value;
};
var setMinimized = function(value) {
Ember.run(function() {
view.set("minimized", value);
});
};
var smallLogoSelector = "img.logo-small";
var bigLogoSelector = "img#site-logo.logo-big";
var homeIconSelector = "i.icon-home";
var headerSelector = "h2#site-text-logo.text-logo";
var appendView = function() {
Ember.run(function() {
view.appendTo(Ember.$("#qunit-fixture"));
});
};
var exists = function(selector) {
return Ember.$(selector).length > 0;
};
module("Discourse.DiscourseLogoComponent", {
setup: function() {
oldMobileView = Discourse.Mobile.mobileView;
setSmallLogoUrl("small-logo-url");
setBigLogoUrl("big-logo-url");
view = View.create();
},
teardown: function() {
Discourse.Mobile.mobileView = oldMobileView;
}
});
test("displays small logo when 'minimized' version is chosen and application is not in mobile mode", function() {
setMobileView(false);
setMinimized(true);
appendView();
ok(exists(smallLogoSelector), "small logo image is present");
equal(Ember.$(smallLogoSelector).attr("src"), "small-logo-url", "small logo image has correct source");
ok(!exists(homeIconSelector), "default home icon is not present");
ok(!exists(bigLogoSelector), "big logo image is not present");
});
test("displays default home icon when small logo image should be displayed but its url is not configured", function() {
setMobileView(false);
setMinimized(true);
setSmallLogoUrl("");
appendView();
ok(exists(homeIconSelector), "default home icon is present");
ok(!exists(smallLogoSelector), "small logo image is not present");
ok(!exists(bigLogoSelector), "big logo image is not present");
});
test("displays big logo when 'minimized' version is not chosen", function() {
setMobileView(false);
setMinimized(false);
appendView();
ok(exists(bigLogoSelector), "big logo image is present");
ok(!exists(smallLogoSelector), "small logo image is not present");
});
test("displays big logo when application is in mobile mode", function() {
setMobileView(true);
setMinimized(true);
appendView();
ok(exists(bigLogoSelector), "big logo image is present");
ok(!exists(smallLogoSelector), "small logo image is not present");
});
test("displays big logo image with alt title when big logo url is configured", function() {
setMobileView(true);
setMinimized(false);
setTitle("site-title");
appendView();
ok(exists(bigLogoSelector), "big logo image is present");
equal(Ember.$(bigLogoSelector).attr("src"), "big-logo-url", "big logo image has correct source");
equal(Ember.$(bigLogoSelector).attr("alt"), "site-title", "big logo image has correct alt text");
ok(!exists(headerSelector), "header with title is not present");
});
test("displays header with site title when big logo image should be displayed but its url is not configured", function() {
setMobileView(true);
setMinimized(false);
setTitle("site-title");
setBigLogoUrl("");
appendView();
ok(exists(headerSelector), "header with title is present");
equal(Ember.$(headerSelector).text(), "site-title", "header with title has correct text");
ok(!exists(bigLogoSelector), "big logo image is not present");
});
test("dynamically toggles logo size when 'minimized' property changes", function() {
setMobileView(false);
setMinimized(true);
appendView();
ok(exists(smallLogoSelector), "initially small logo is shown");
setMinimized(false);
ok(exists(bigLogoSelector), "when 'minimized' version is turned off, small logo is replaced with the big one");
});
test("links logo to the site root", function() {
appendView();
equal(Ember.$(".title > a").attr("href"), "/");
});