Skip to content

Commit

Permalink
Revert "⏮ Rollback timeZoneName changes (#35895)" (#35911)
Browse files Browse the repository at this point in the history 
This reverts commit 017c5a8.
  • Loading branch information
@alanorozco
alanorozco committed Sep 1, 2021
1 parent 2f9388f commit a41366d
Show file tree
Hide file tree
Showing 10 changed files with 226 additions and 46 deletions.
2 changes: 2 additions & 0 deletions build-system/compile/sources.js
View file
Expand Up @@ -107,6 +107,8 @@ const CLOSURE_SRC_GLOBS = [
'extensions/amp-lightbox/1.0/*.js',
// For amp-bind in the web worker (ww.js).
'extensions/amp-bind/**/*.js',
// amp-date-display 0.1 and 1.0 share this file.
'extensions/amp-date-display/format.js',
// Needed to access to Variant interface from other extensions
'extensions/amp-experiment/**/*.js',
// Needed to access form impl from other extensions
Expand Down
3 changes: 3 additions & 0 deletions build-system/test-configs/dep-check-config.js
View file
Expand Up @@ -214,6 +214,9 @@ exports.rules = [
'extensions/amp-lightbox-gallery/1.0/base-element.js->extensions/amp-lightbox/1.0/component.jss.js',
'extensions/amp-lightbox-gallery/1.0/base-element.js->extensions/amp-base-carousel/1.0/component.jss.js',

// <amp-date-display> versions share these date format helpers
'extensions/amp-date-display/**->extensions/amp-date-display/format.js',

// Facebook components
'extensions/amp-facebook/1.0/amp-facebook.js->extensions/amp-facebook/0.1/facebook-loader.js',
'extensions/amp-facebook-page/0.1/amp-facebook-page.js->extensions/amp-facebook/0.1/facebook-loader.js',
Expand Down
12 changes: 12 additions & 0 deletions extensions/amp-date-display/0.1/amp-date-display.js
View file
Expand Up @@ -7,6 +7,7 @@ import {Services} from '#service';

import {createCustomEvent} from '../../../src/event-helper';
import {dev, devAssert, user, userAssert} from '../../../src/log';
import {getTimeZoneName} from '../format';

/** @const {string} */
const TAG = 'amp-date-display';
Expand Down Expand Up @@ -38,6 +39,8 @@ const DEFAULT_DATETIME_OPTIONS = {
minute: number,
second: number,
iso: string,
timeZoneName: string,
timeZoneNameShort: string,
}} */
let VariablesDef;

Expand Down Expand Up @@ -268,6 +271,8 @@ export class AmpDateDisplay extends AMP.BaseElement {
second: date.getSeconds(),
iso: date.toISOString(),
localeString: this.getLocaleString_(date, locale, localeOptions),
timeZoneName: getTimeZoneName(date, locale, localeOptions),
timeZoneNameShort: getTimeZoneName(date, locale, localeOptions, 'short'),
};
}

Expand Down Expand Up @@ -308,6 +313,13 @@ export class AmpDateDisplay extends AMP.BaseElement {
second: date.getUTCSeconds(),
iso: date.toISOString(),
localeString: this.getLocaleString_(date, locale, localeOptionsInUTC),
timeZoneName: getTimeZoneName(date, locale, localeOptionsInUTC),
timeZoneNameShort: getTimeZoneName(
date,
locale,
localeOptionsInUTC,
'short'
),
};
}

Expand Down
48 changes: 25 additions & 23 deletions extensions/amp-date-display/0.1/amp-date-display.md
View file
Expand Up @@ -39,29 +39,31 @@ for rendering. Refer to the

This table lists the format you can specify in your Mustache template:

| Format | Meaning |
| -------------- | ------------------------------------------------------------- |
| day | 1, 2, ...12, 13, etc. |
| dayName | string, |
| dayNameShort | string, |
| dayPeriod | string, |
| dayTwoDigit | 01, 02, 03, ..., 12, 13, etc. |
| hour | 0, 1, 2, 3, ..., 12, 13, ..., 22, 23 |
| hour12 | 1, 2, 3, ..., 12, 1, 2, ..., 11, 12 |
| hour12TwoDigit | 01, 02, ..., 12, 01, 02, ..., 11, 12 |
| hourTwoDigit | 00, 01, 02, ..., 12, 13, ..., 22, 23 |
| iso | A standard ISO8601 date string e.g. 2019-01-23T15:31:21.213Z, |
| minute | 0, 1, 2, ..., 58, 59 |
| minuteTwoDigit | 00, 01, 02, ..., 58, 59 |
| month | 1, 2, 3, ..., 12 |
| monthName | Internationalized month name string. |
| monthNameShort | Internationalized abbreviated month name string., |
| monthTwoDigit | 01, 02, ..., 11, 12 |
| second | 0, 1, 2, ..., 58, 59 |
| secondTwoDigit | 00, 01, 02, ..., 58, 59 |
| year | 0, 1, 2, ..., 1999, 2000, 2001, etc. |
| yearTwoDigit | 00, 01, 02, ..., 17, 18, 19, ..., 98, 99 |
| localeString | A string with a language sensitive representation. |
| Format | Meaning |
| ----------------- | ------------------------------------------------------------- |
| day | 1, 2, ...12, 13, etc. |
| dayName | string, |
| dayNameShort | string, |
| dayPeriod | string, |
| dayTwoDigit | 01, 02, 03, ..., 12, 13, etc. |
| hour | 0, 1, 2, 3, ..., 12, 13, ..., 22, 23 |
| hour12 | 1, 2, 3, ..., 12, 1, 2, ..., 11, 12 |
| hour12TwoDigit | 01, 02, ..., 12, 01, 02, ..., 11, 12 |
| hourTwoDigit | 00, 01, 02, ..., 12, 13, ..., 22, 23 |
| iso | A standard ISO8601 date string e.g. 2019-01-23T15:31:21.213Z, |
| localeString | A string with a language sensitive representation. |
| minute | 0, 1, 2, ..., 58, 59 |
| minuteTwoDigit | 00, 01, 02, ..., 58, 59 |
| month | 1, 2, 3, ..., 12 |
| monthName | Internationalized month name string. |
| monthNameShort | Internationalized abbreviated month name string., |
| monthTwoDigit | 01, 02, ..., 11, 12 |
| second | 0, 1, 2, ..., 58, 59 |
| secondTwoDigit | 00, 01, 02, ..., 58, 59 |
| timeZoneName | Internationalized timezone, like `Pacific Daylight Time` |
| timeZoneNameShort | Internationalized timezone, abbreviated, like `PST` |
| year | 0, 1, 2, ..., 1999, 2000, 2001, etc. |
| yearTwoDigit | 00, 01, 02, ..., 17, 18, 19, ..., 98, 99 |

## Attributes

Expand Down
37 changes: 37 additions & 0 deletions extensions/amp-date-display/0.1/test/test-amp-date-display.js
View file
Expand Up @@ -70,6 +70,8 @@ describes.realWin(
expect(data.secondTwoDigit).to.equal('06');
expect(data.dayPeriod).to.equal('am');
expect(data.localeString).to.equal('Feb 3, 2001, 4:05 AM');
expect(data.timeZoneName).to.equal('Coordinated Universal Time');
expect(data.timeZoneNameShort).to.equal('UTC');
});

it('provides all variables in local and English (default)', async () => {
Expand Down Expand Up @@ -98,8 +100,43 @@ describes.realWin(
expect(data.secondTwoDigit).to.equal('06');
expect(data.dayPeriod).to.equal('am');
expect(data.localeString).to.equal('Feb 3, 2001, 4:05 AM');
// default timezone is affected by running platform, so we just verify
// that both timezone values are present, and that they differ.
// (Another set of tests below verify that the timezone is labelled
// properly in different locales.)
expect(data.timeZoneName).to.be.ok;
expect(data.timeZoneNameShort).to.be.ok;
expect(data.timeZoneName).to.not.equal(data.timeZoneNameShort);
});

const expectedTimeZoneNamesAmericaNewYork = {
'en': {
timeZoneName: 'Eastern Standard Time',
timeZoneNameShort: 'EST',
},
'ja-JP': {
timeZoneName: 'アメリカ東部標準時',
timeZoneNameShort: 'GMT-5',
},
'ar-EG': {
timeZoneName: 'التوقيت الرسمي الشرقي لأمريكا الشمالية',
timeZoneNameShort: 'غرينتش-٥',
},
};
for (const locale in expectedTimeZoneNamesAmericaNewYork) {
const {timeZoneName, timeZoneNameShort} =
expectedTimeZoneNamesAmericaNewYork[locale];
it(`provides timeZoneName and timeZoneNameShort with specified TZ (${locale})`, async () => {
element.setAttribute('datetime', '2001-02-03T04:05:06.007Z');
element.setAttribute('locale', locale);
element.setAttribute('data-options-time-zone', 'America/New_York');
await element.buildInternal();
const data = impl.getDataForTemplate_();
expect(data.timeZoneName).to.equal(timeZoneName);
expect(data.timeZoneNameShort).to.equal(timeZoneNameShort);
});
}

describe('correctly parses', () => {
it('now keyword', async () => {
element.setAttribute('datetime', 'now');
Expand Down
10 changes: 10 additions & 0 deletions extensions/amp-date-display/1.0/component.js
View file
Expand Up @@ -6,6 +6,7 @@ import {Wrapper, useRenderer} from '#preact/component';
import {useResourcesNotify} from '#preact/utils';

import {user} from '../../../src/log';
import {getTimeZoneName} from '../format';

/** @const {string} */
const TAG = 'amp-date-display';
Expand Down Expand Up @@ -200,6 +201,8 @@ function getVariablesInLocal(
'second': date.getSeconds(),
'iso': date.toISOString(),
'localeString': getLocaleString_(date, locale, localeOptions),
'timeZoneName': getTimeZoneName(date, locale, localeOptions),
'timeZoneNameShort': getTimeZoneName(date, locale, localeOptions, 'short'),
};
}

Expand Down Expand Up @@ -243,5 +246,12 @@ function getVariablesInUTC(
'second': date.getUTCSeconds(),
'iso': date.toISOString(),
'localeString': getLocaleString_(date, locale, localeOptionsInUTC),
'timeZoneName': getTimeZoneName(date, locale, localeOptionsInUTC),
'timeZoneNameShort': getTimeZoneName(
date,
locale,
localeOptionsInUTC,
'short'
),
};
}
39 changes: 39 additions & 0 deletions extensions/amp-date-display/1.0/test/test-amp-date-display.js
View file
Expand Up @@ -63,6 +63,8 @@ describes.realWin(
dayPeriod: '{{dayPeriod}}',
iso: '{{iso}}',
localeString: '{{localeString}}',
timeZoneName: '{{timeZoneName}}',
timeZoneNameShort: '{{timeZoneNameShort}}',
});
element.appendChild(template);
element.setAttribute('layout', 'nodisplay');
Expand Down Expand Up @@ -95,6 +97,8 @@ describes.realWin(
expect(data.secondTwoDigit).to.equal('06');
expect(data.dayPeriod).to.equal('am');
expect(data.localeString).to.equal('Feb 3, 2001, 4:05 AM');
expect(data.timeZoneName).to.equal('Coordinated Universal Time');
expect(data.timeZoneNameShort).to.equal('UTC');
});

it('renders mustache template with "timestamp-ms"', async () => {
Expand Down Expand Up @@ -127,8 +131,43 @@ describes.realWin(
expect(data.secondTwoDigit).to.equal('06');
expect(data.dayPeriod).to.equal('am');
expect(data.localeString).to.equal('Feb 3, 2001, 4:05 AM');
// default timezone is affected by running platform, so we just verify
// that both timezone values are present, and that they differ.
// (Another set of tests below verify that the timezone is labelled
// properly in different locales.)
expect(data.timeZoneName).to.be.ok;
expect(data.timeZoneNameShort).to.be.ok;
expect(data.timeZoneName).to.not.equal(data.timeZoneNameShort);
});

const expectedTimeZoneNamesAmericaNewYork = {
'en': {
timeZoneName: 'Eastern Standard Time',
timeZoneNameShort: 'EST',
},
'ja-JP': {
timeZoneName: 'アメリカ東部標準時',
timeZoneNameShort: 'GMT-5',
},
'ar-EG': {
timeZoneName: 'التوقيت الرسمي الشرقي لأمريكا الشمالية',
timeZoneNameShort: 'غرينتش-٥',
},
};
for (const locale in expectedTimeZoneNamesAmericaNewYork) {
const {timeZoneName, timeZoneNameShort} =
expectedTimeZoneNamesAmericaNewYork[locale];
it(`provides timeZoneName and timeZoneNameShort with specified TZ (${locale}})`, async () => {
element.setAttribute('datetime', '2001-02-03T04:05:06.007Z');
element.setAttribute('locale', locale);
element.setAttribute('data-options-time-zone', 'America/New_York');
win.document.body.appendChild(element);
const data = await getRenderedData();
expect(data.timeZoneName).to.equal(timeZoneName);
expect(data.timeZoneNameShort).to.equal(timeZoneNameShort);
});
}

it('render localeString with data-options-time-style', async () => {
element.setAttribute('datetime', '2001-02-03T04:05:06.007Z');
element.setAttribute('display-in', 'UTC');
Expand Down
44 changes: 44 additions & 0 deletions extensions/amp-date-display/1.0/test/test-component.js
View file
Expand Up @@ -175,6 +175,13 @@ describes.sandboxed('DateDisplay 1.0 preact component', {}, (env) => {
expect(data.second).to.equal('6');
expect(data.secondTwoDigit).to.equal('06');
expect(data.dayPeriod).to.equal('am');
// default timezone is affected by running platform, so we just verify
// that both timezone values are present, and that they differ.
// (Another set of tests below verify that the timezone is labelled
// properly in different locales.)
expect(data.timeZoneName).to.be.ok;
expect(data.timeZoneNameShort).to.be.ok;
expect(data.timeZoneName).to.not.equal(data.timeZoneNameShort);
});

it('provides variables in Czech when "cs" locale is passed', () => {
Expand All @@ -193,6 +200,8 @@ describes.sandboxed('DateDisplay 1.0 preact component', {}, (env) => {
expect(data.monthNameShort).to.equal('úno');
expect(data.dayName).to.equal('sobota');
expect(data.dayNameShort).to.equal('so');
expect(data.timeZoneName).to.equal('Koordinovaný světový čas');
expect(data.timeZoneNameShort).to.equal('UTC');
});

it('shows custom locale string when localeOptions is passed', () => {
Expand All @@ -211,6 +220,41 @@ describes.sandboxed('DateDisplay 1.0 preact component', {}, (env) => {
expect(data.localeString).to.equal('上午4:05');
});

const expectedTimeZoneNamesAmericaNewYork = {
'en': {
timeZoneName: 'Eastern Standard Time',
timeZoneNameShort: 'EST',
},
'ja-JP': {
timeZoneName: 'アメリカ東部標準時',
timeZoneNameShort: 'GMT-5',
},
'ar-EG': {
timeZoneName: 'التوقيت الرسمي الشرقي لأمريكا الشمالية',
timeZoneNameShort: 'غرينتش-٥',
},
};
for (const locale in expectedTimeZoneNamesAmericaNewYork) {
const {timeZoneName, timeZoneNameShort} =
expectedTimeZoneNamesAmericaNewYork[locale];
it(`shows timeZoneName and timeZoneNameShort with specified TZ (${locale})`, () => {
const jsx = (
<DateDisplay
render={render}
datetime={Date.parse('2001-02-03T04:05:06.007Z')}
locale={locale}
localeOptions={{
timeZone: 'America/New_York',
}}
/>
);
const wrapper = mount(jsx);
const data = JSON.parse(wrapper.text());
expect(data.timeZoneName).to.equal(timeZoneName);
expect(data.timeZoneNameShort).to.equal(timeZoneNameShort);
});
}

describe('invalid data-options-* settings', () => {
it('throws error when invalid localeOptions is passed', () => {
const spy = env.sandbox.stub(user(), 'error');
Expand Down
48 changes: 25 additions & 23 deletions extensions/amp-date-display/amp-date-display.md
View file
Expand Up @@ -41,29 +41,31 @@ for rendering. Refer to the

This table lists the format you can specify in your Mustache template:

| Format | Meaning |
| -------------- | ------------------------------------------------------------- |
| day | 1, 2, ...12, 13, etc. |
| dayName | string, |
| dayNameShort | string, |
| dayPeriod | string, |
| dayTwoDigit | 01, 02, 03, ..., 12, 13, etc. |
| hour | 0, 1, 2, 3, ..., 12, 13, ..., 22, 23 |
| hour12 | 1, 2, 3, ..., 12, 1, 2, ..., 11, 12 |
| hour12TwoDigit | 01, 02, ..., 12, 01, 02, ..., 11, 12 |
| hourTwoDigit | 00, 01, 02, ..., 12, 13, ..., 22, 23 |
| iso | A standard ISO8601 date string e.g. 2019-01-23T15:31:21.213Z, |
| minute | 0, 1, 2, ..., 58, 59 |
| minuteTwoDigit | 00, 01, 02, ..., 58, 59 |
| month | 1, 2, 3, ..., 12 |
| monthName | Internationalized month name string. |
| monthNameShort | Internationalized abbreviated month name string., |
| monthTwoDigit | 01, 02, ..., 11, 12 |
| second | 0, 1, 2, ..., 58, 59 |
| secondTwoDigit | 00, 01, 02, ..., 58, 59 |
| year | 0, 1, 2, ..., 1999, 2000, 2001, etc. |
| yearTwoDigit | 00, 01, 02, ..., 17, 18, 19, ..., 98, 99 |
| localeString | A string with a language sensitive representation. |
| Format | Meaning |
| ----------------- | ------------------------------------------------------------- |
| day | 1, 2, ...12, 13, etc. |
| dayName | string, |
| dayNameShort | string, |
| dayPeriod | string, |
| dayTwoDigit | 01, 02, 03, ..., 12, 13, etc. |
| hour | 0, 1, 2, 3, ..., 12, 13, ..., 22, 23 |
| hour12 | 1, 2, 3, ..., 12, 1, 2, ..., 11, 12 |
| hour12TwoDigit | 01, 02, ..., 12, 01, 02, ..., 11, 12 |
| hourTwoDigit | 00, 01, 02, ..., 12, 13, ..., 22, 23 |
| iso | A standard ISO8601 date string e.g. 2019-01-23T15:31:21.213Z, |
| localeString | A string with a language sensitive representation. |
| minute | 0, 1, 2, ..., 58, 59 |
| minuteTwoDigit | 00, 01, 02, ..., 58, 59 |
| month | 1, 2, 3, ..., 12 |
| monthName | Internationalized month name string. |
| monthNameShort | Internationalized abbreviated month name string., |
| monthTwoDigit | 01, 02, ..., 11, 12 |
| second | 0, 1, 2, ..., 58, 59 |
| secondTwoDigit | 00, 01, 02, ..., 58, 59 |
| timeZoneName | Internationalized timezone, like `Pacific Daylight Time` |
| timeZoneNameShort | Internationalized timezone, abbreviated, like `PST` |
| year | 0, 1, 2, ..., 1999, 2000, 2001, etc. |
| yearTwoDigit | 00, 01, 02, ..., 17, 18, 19, ..., 98, 99 |

### Standalone use outside valid AMP documents

Expand Down

0 comments on commit a41366d

Please sign in to comment.