DEV: allows to define an ariaLabel on d-button (#9716)

* DEV: allows to define an ariaLabel on d-button

This topic also adds this function to topic-footer-buttons, simplifies the whole logic of titile/label/arialabel in d-button and adds tests for these properties.

* typo
This commit is contained in:
Joffrey JAFFEUX
2020-05-11 18:42:51 +02:00
committed by GitHub
parent c6bf552ca3
commit 7a95dd4841
5 changed files with 114 additions and 27 deletions

View File

@ -100,3 +100,75 @@ componentTest("disabled button", {
assert.ok(find("button:not([disabled])").length, "the button is enabled");
}
});
componentTest("aria-label", {
template:
"{{d-button ariaLabel=ariaLabel translatedAriaLabel=translatedAriaLabel}}",
beforeEach() {
I18n.translations[I18n.locale].js.test = { fooAriaLabel: "foo" };
},
test(assert) {
this.set("ariaLabel", "test.fooAriaLabel");
assert.equal(
find("button")[0].getAttribute("aria-label"),
I18n.t("test.fooAriaLabel")
);
this.setProperties({
ariaLabel: null,
translatedAriaLabel: "bar"
});
assert.equal(find("button")[0].getAttribute("aria-label"), "bar");
}
});
componentTest("title", {
template: "{{d-button title=title translatedTitle=translatedTitle}}",
beforeEach() {
I18n.translations[I18n.locale].js.test = { fooTitle: "foo" };
},
test(assert) {
this.set("title", "test.fooTitle");
assert.equal(
find("button")[0].getAttribute("title"),
I18n.t("test.fooTitle")
);
this.setProperties({
title: null,
translatedTitle: "bar"
});
assert.equal(find("button")[0].getAttribute("title"), "bar");
}
});
componentTest("label", {
template: "{{d-button label=label translatedLabel=translatedLabel}}",
beforeEach() {
I18n.translations[I18n.locale].js.test = { fooLabel: "foo" };
},
test(assert) {
this.set("label", "test.fooLabel");
assert.equal(
find("button .d-button-label").text(),
I18n.t("test.fooLabel")
);
this.setProperties({
label: null,
translatedLabel: "bar"
});
assert.equal(find("button .d-button-label").text(), "bar");
}
});