Bug 1683865 - Replace xul:image usage in setting event reminders. r=darktrojan

Also removed the test_addReminderImages unit test since it was testing ui features without 'document' or its localization, which is needed for setting img alt text.

Differential Revision: https://phabricator.services.mozilla.com/D111594
This commit is contained in:
Henry Wilkes 2021-04-21 11:20:46 +00:00
Родитель f9d37caed5
Коммит 66bf39da97
12 изменённых файлов: 86 добавлений и 75 удалений

Просмотреть файл

@ -304,10 +304,10 @@
let alarms = item.getAlarms();
if (alarms.length && Services.prefs.getBoolPref("calendar.alarms.indicator.show", true)) {
let iconsBox = this.querySelector(".alarm-icons-box");
cal.alarms.addReminderImages(iconsBox, alarms);
// Set suppressed status on the icons box.
iconsBox.toggleAttribute("suppressed", item.calendar.getProperty("suppressAlarms"));
cal.alarms.addReminderImages(iconsBox, alarms);
}
// Item classification / privacy.

Просмотреть файл

@ -226,12 +226,28 @@ function setupListItem(aListItem, aReminder, aItem) {
listitem.setAttribute("aria-labelledby", ariaLabel);
listitem.setAttribute("value", aReminder.action);
let image = listitem.querySelector("image");
let image = listitem.querySelector("img");
if (!image) {
image = document.createXULElement("image");
image = document.createElement("img");
image.setAttribute("class", "reminder-icon");
listitem.appendChild(image);
}
switch (aReminder.action) {
case "DISPLAY":
image.setAttribute("src", "chrome://calendar/skin/shared/icons/alarm.svg");
// Sets alt.
document.l10n.setAttributes(image, "calendar-event-reminder-icon-display");
break;
case "EMAIL":
image.setAttribute("src", "chrome://calendar/skin/shared/icons/email.svg");
// Sets alt.
document.l10n.setAttributes(image, "calendar-event-reminder-icon-email");
break;
default:
image.removeAttribute("src");
image.setAttribute("alt", "");
break;
}
image.setAttribute("value", aReminder.action);
let label = listitem.querySelector("label");

Просмотреть файл

@ -26,6 +26,10 @@
<dialog>
<linkset>
<html:link rel="localization" href="calendar/calendar-event-dialog-reminder.ftl"/>
</linkset>
<!-- Javascript includes -->
<script src="chrome://calendar/content/calendar-event-dialog-reminder.js"/>
<script src="chrome://calendar/content/calendar-ui-utils.js"/>
@ -114,16 +118,16 @@
</hbox>
<menulist id="reminder-actions-menulist"
oncommand="updateReminder(event)"
class="reminder-icon">
class="reminder-list-icon">
<!-- Make sure the id is formatted "reminder-action-<VALUE>", for accessibility -->
<!-- TODO provider specific -->
<menupopup id="reminder-actions-menupopup">
<menuitem id="reminder-action-DISPLAY"
class="reminder-icon menuitem-iconic"
class="reminder-list-icon menuitem-iconic"
value="DISPLAY"
label="&reminder.action.alert.label;"/>
<menuitem id="reminder-action-EMAIL"
class="reminder-icon menuitem-iconic"
class="reminder-list-icon menuitem-iconic"
value="EMAIL"
label="&reminder.action.email.label;"/>
</menupopup>

Просмотреть файл

@ -4,7 +4,6 @@
- file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
<?xml-stylesheet type="text/css" href="chrome://global/skin/global.css"?>
<?xml-stylesheet type="text/css" href="chrome://calendar/skin/shared/calendar-alarms.css"?>
<?xml-stylesheet type="text/css" href="chrome://calendar/skin/shared/widgets/minimonth.css"?>
<?xml-stylesheet type="text/css" href="chrome://calendar/skin/shared/calendar-attendees.css"?>
<?xml-stylesheet type="text/css" href="chrome://calendar/skin/shared/dialogs/calendar-event-dialog.css"?>

Просмотреть файл

@ -24,7 +24,10 @@
data-l10n-id="calendar-ics-file-dialog-2"
data-l10n-attrs="buttonlabelaccept">
<html:link rel="localization" href="calendar/calendar-ics-file-dialog.ftl"/>
<linkset>
<html:link rel="localization" href="calendar/calendar-ics-file-dialog.ftl"/>
<html:link rel="localization" href="calendar/calendar-editable-item.ftl"/>
</linkset>
<script src="chrome://calendar/content/calendar-ics-file-dialog.js"></script>
<script src="chrome://calendar/content/import-export.js"></script>

Просмотреть файл

@ -41,7 +41,10 @@
<dialog buttons=",">
<html:link rel="localization" href="calendar/calendar-summary-dialog.ftl"/>
<linkset>
<html:link rel="localization" href="calendar/calendar-summary-dialog.ftl"/>
<html:link rel="localization" href="calendar/calendar-editable-item.ftl"/>
</linkset>
<!-- Javascript includes -->
<script src="chrome://global/content/globalOverlay.js"/>

Просмотреть файл

@ -139,9 +139,35 @@ var calalarms = {
*/
addReminderImages(aElement, aReminders) {
function setupActionImage(node, reminder) {
let image = node || aElement.ownerDocument.createXULElement("image");
let document = aElement.ownerDocument;
let image = node || document.createElement("img");
image.setAttribute("class", "reminder-icon");
image.setAttribute("value", reminder.action);
switch (reminder.action) {
case "DISPLAY":
if (aElement.hasAttribute("suppressed")) {
image.setAttribute("src", "chrome://calendar/skin/shared/icons/alarm-no.svg");
// Sets alt.
document.l10n.setAttributes(
image,
"calendar-editable-item-reminder-icon-suppressed-alarm"
);
break;
}
image.setAttribute("src", "chrome://calendar/skin/shared/icons/alarm.svg");
// Sets alt.
document.l10n.setAttributes(image, "calendar-editable-item-reminder-icon-alarm");
break;
case "EMAIL":
image.setAttribute("src", "chrome://calendar/skin/shared/icons/email.svg");
// Sets alt.
document.l10n.setAttributes(image, "calendar-editable-item-reminder-icon-email");
break;
default:
image.removeAttribute("src");
image.setAttribute("alt", "");
break;
}
return image;
}

Просмотреть файл

@ -10,15 +10,11 @@
fill: currentColor;
}
.reminder-icon[value="DISPLAY"] {
.reminder-list-icon[value="DISPLAY"] {
list-style-image: url(chrome://calendar/skin/shared/icons/alarm.svg);
}
.alarm-icons-box[suppressed] > .reminder-icon[value="DISPLAY"] {
list-style-image: url(chrome://calendar/skin/shared/icons/alarm-no.svg);
}
.reminder-icon[value="EMAIL"] {
.reminder-list-icon[value="EMAIL"] {
list-style-image: url(chrome://calendar/skin/shared/icons/email.svg);
}

Просмотреть файл

@ -36,6 +36,10 @@
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
xmlns:html="http://www.w3.org/1999/xhtml">
<linkset>
<html:link rel="localization" href="calendar/calendar-editable-item.ftl"/>
</linkset>
<!-- JavaScript includes -->
<script src="chrome://lightning/content/lightning-item-iframe.js"/>
<script src="chrome://calendar/content/calendar-dialog-utils.js"/>

Просмотреть файл

@ -22,3 +22,12 @@ calendar-editable-item-multiday-event-icon-continue =
calendar-editable-item-multiday-event-icon-end =
.alt = Multiple-day event ends
calendar-editable-item-reminder-icon-alarm =
.alt = A reminder alert is scheduled
calendar-editable-item-reminder-icon-suppressed-alarm =
.alt = A reminder alert is scheduled but currently suppressed
calendar-editable-item-reminder-icon-email =
.alt = A reminder e-mail is scheduled

Просмотреть файл

@ -0,0 +1,9 @@
# This Source Code Form is subject to the terms of the Mozilla Public
# License, v. 2.0. If a copy of the MPL was not distributed with this
# file, You can obtain one at http://mozilla.org/MPL/2.0/.
calendar-event-reminder-icon-display =
.alt = Show an Alert
calendar-event-reminder-icon-email =
.alt = Send an E-mail

Просмотреть файл

@ -195,61 +195,3 @@ add_task(async function test_calculateAlarmOffset() {
alarm.offset = cal.createDuration("-PT1H");
equal(calculateAlarmOffset(alarm).icalString, "-PT1H");
});
add_task(async function test_addReminderImages() {
function createReminders(actions) {
let reminders = [];
for (let action of actions) {
let reminder = new CalAlarm();
reminder.action = action;
reminders.push(reminder);
}
return reminders;
}
function checkReminder(node, actions, msg) {
let actionset = new Set(actions);
equal(box.children.length, actions.length);
for (let i = 0, len = box.children.length; i < len; i++) {
let actionvalue = box.children[i].getAttribute("value");
equal(box.children[i].localName, "image", msg + " (is image)");
ok(actionset.has(actionvalue), msg + " (has action)");
equal(box.children[i].getAttribute("class"), "reminder-icon", msg + " (has class)");
actionset.delete(actionvalue);
}
}
let xul_ns = "http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul";
let doc = cal.xml.parseString("<window xmlns='" + xul_ns + "'><box/></window>");
let box = doc.documentElement.firstElementChild;
let actions = ["DISPLAY"];
let reminders = createReminders(actions);
cal.alarms.addReminderImages(box, reminders);
checkReminder(box, actions, "first addition");
actions = ["DISPLAY"];
reminders = createReminders(actions);
cal.alarms.addReminderImages(box, reminders);
checkReminder(box, actions, "same reminders again");
actions = ["DISPLAY", "EMAIL", "SMS"];
reminders = createReminders(actions);
cal.alarms.addReminderImages(box, reminders);
checkReminder(box, actions, "added email and sms reminder");
actions = ["EMAIL", "SMS"];
reminders = createReminders(actions);
cal.alarms.addReminderImages(box, reminders);
checkReminder(box, actions, "removed display reminder");
actions = ["DISPLAY"];
reminders = createReminders(actions);
cal.alarms.addReminderImages(box, reminders);
checkReminder(box, actions, "replaced all reminders");
actions = [];
reminders = createReminders(actions);
cal.alarms.addReminderImages(box, reminders);
checkReminder(box, actions, "removed all reminders");
});