Skip to content

Commit

Permalink
fix(input-time-zone): allow searching offsets by Etc/x time zone (#7978)
Browse files Browse the repository at this point in the history 
**Related Issue:** #7957 

## Summary

This extended search behavior allows users to find `Etc/GMT+12`, which
would not appear before as it did not have a [IANA
identifier](https://en.wikipedia.org/wiki/List_of_tz_database_time_zones#List)
tied to a city.

**Note**: this bumps `timezone-groups` to v0.8.0 which ensures all
`Etc/x` time zones are included in all groups.
  • Loading branch information
@jcfranco
jcfranco authored Oct 11, 2023
1 parent aedd4f3 commit 2c34b42
Show file tree
Hide file tree
Showing 4 changed files with 109 additions and 44 deletions.
16 changes: 8 additions & 8 deletions package-lock.json
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion packages/calcite-components/package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -74,7 +74,7 @@
"form-request-submit-polyfill": "2.0.0",
"lodash-es": "4.17.21",
"sortablejs": "1.15.0",
"timezone-groups": "0.7.0"
"timezone-groups": "0.8.0"
},
"devDependencies": {
"@esri/calcite-design-tokens": "1.0.0",
Expand Down
109 changes: 100 additions & 9 deletions packages/calcite-components/src/components/input-time-zone/input-time-zone.e2e.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -175,6 +175,60 @@ describe("calcite-input-time-zone", () => {

expect(await timeZoneItem.getProperty("textLabel")).toMatch(testTimeZoneNamesAndOffsets[2].label);
});

it("looks up in label and time zone groups (not displayed)", async () => {
const searchTerms = ["London", "Belfast", "GMT-12"];

const page = await newE2EPage();
await page.emulateTimezone(testTimeZoneNamesAndOffsets[0].name);
await page.setContent(
await addTimeZoneNamePolyfill(html` <calcite-input-time-zone></calcite-input-time-zone>`)
);

const input = await page.find("calcite-input-time-zone");

async function clearSearchTerm(searchTerm: string): Promise<void> {
for (let i = 0; i < searchTerm.length; i++) {
await input.press("Backspace");
}
}

let matchedTimeZoneItems = await page.findAll(
"calcite-input-time-zone >>> calcite-combobox-item:not([hidden])"
);
expect(matchedTimeZoneItems.length).toBeGreaterThan(1);

await input.click();
await input.type(searchTerms[0]);
await page.waitForChanges();

matchedTimeZoneItems = await page.findAll("calcite-input-time-zone >>> calcite-combobox-item:not([hidden])");

expect(matchedTimeZoneItems).toHaveLength(1);

await clearSearchTerm(searchTerms[0]);
await input.type(searchTerms[1]);
await page.waitForChanges();

matchedTimeZoneItems = await page.findAll("calcite-input-time-zone >>> calcite-combobox-item:not([hidden])");

expect(matchedTimeZoneItems).toHaveLength(1);

await clearSearchTerm(searchTerms[1]);
await input.type(searchTerms[2]);
await page.waitForChanges();

matchedTimeZoneItems = await page.findAll("calcite-input-time-zone >>> calcite-combobox-item:not([hidden])");

expect(matchedTimeZoneItems).toHaveLength(2);

await clearSearchTerm(searchTerms[1]);
await page.waitForChanges();

matchedTimeZoneItems = await page.findAll("calcite-input-time-zone >>> calcite-combobox-item:not([hidden])");

expect(matchedTimeZoneItems.length).toBeGreaterThan(1);
});
});

describe("name", () => {
Expand Down Expand Up @@ -302,17 +356,29 @@ function addTimeZoneNamePolyfill(testHtml: string): string {
if (timeZoneName === "shortOffset") {
const { timeZone } = this.originalOptions;
let offsetString;
// hardcoding GMT and time zone names for this particular test suite
const offsetString =
"GMT" +
(timeZone === "America/Los_Angeles"
? "-7"
: timeZone === "America/Denver"
? "-6"
: timeZone === "Europe/London" || timeZone === "Europe/Belfast" || timeZone === "Etc/GMT-1"
? "+1"
: "+0");
if (timeZone.includes("Etc/")) {
offsetString = timeZone.replace("Etc/", "GMT");
// Etc/x time zones have the opposite sign of the offset
if (offsetString.includes("+")) {
offsetString = offsetString.replace("+", "-");
} else if (offsetString.includes("-")) {
offsetString = offsetString.replace("-", "+");
}
} else {
offsetString =
"GMT" +
(timeZone === "America/Los_Angeles"
? "-7"
: timeZone === "America/Denver"
? "-6"
: timeZone === "Europe/London" || timeZone === "Europe/Belfast"
? "+1"
: "+0");
}
originalParts.push({ type: "timeZoneName", value: offsetString });
}
Expand Down Expand Up @@ -345,7 +411,32 @@ function addTimeZoneNamePolyfill(testHtml: string): string {
"Europe/London",
// not available in Chromium v92 at time of testing
"Etc/GMT+1",
"Etc/GMT+10",
"Etc/GMT+11",
"Etc/GMT+12",
"Etc/GMT+2",
"Etc/GMT+3",
"Etc/GMT+4",
"Etc/GMT+5",
"Etc/GMT+6",
"Etc/GMT+7",
"Etc/GMT+8",
"Etc/GMT+9",
"Etc/GMT-1",
"Etc/GMT-10",
"Etc/GMT-11",
"Etc/GMT-12",
"Etc/GMT-13",
"Etc/GMT-14",
"Etc/GMT-2",
"Etc/GMT-3",
"Etc/GMT-4",
"Etc/GMT-5",
"Etc/GMT-6",
"Etc/GMT-7",
"Etc/GMT-8",
"Etc/GMT-9",
"Europe/Belfast",
];
}
Expand Down
26 changes: 0 additions & 26 deletions packages/calcite-components/src/components/input-time-zone/utils.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,32 +10,6 @@ const timeZoneNameBlockList = [
"EET",
"EST",
"EST5EDT",
"Etc/GMT+1",
"Etc/GMT+10",
"Etc/GMT+11",
"Etc/GMT+12",
"Etc/GMT+2",
"Etc/GMT+3",
"Etc/GMT+4",
"Etc/GMT+5",
"Etc/GMT+6",
"Etc/GMT+7",
"Etc/GMT+8",
"Etc/GMT+9",
"Etc/GMT-1",
"Etc/GMT-10",
"Etc/GMT-11",
"Etc/GMT-12",
"Etc/GMT-13",
"Etc/GMT-14",
"Etc/GMT-2",
"Etc/GMT-3",
"Etc/GMT-4",
"Etc/GMT-5",
"Etc/GMT-6",
"Etc/GMT-7",
"Etc/GMT-8",
"Etc/GMT-9",
"Factory",
"HST",
"MET",
Expand Down

0 comments on commit 2c34b42

Please sign in to comment.