fix: allow %Z for TimezoneDate, update docs accordingly #684

src/filters/date.ts

@@ -25,9 +25,9 @@ export function date (this: FilterImpl, v: string | Date, format?: string, timez
   }
   if (!isValidDate(date)) return v
   if (timezoneOffset !== undefined) {
-    date = new TimezoneDate(date, parseTimezoneOffset(date, timezoneOffset))
+    date = new TimezoneDate(date, timezoneOffset)
   } else if (!(date instanceof TimezoneDate) && opts.timezoneOffset !== undefined) {
-    date = new TimezoneDate(date, parseTimezoneOffset(date, opts.timezoneOffset))
+    date = new TimezoneDate(date, opts.timezoneOffset)
   }
   return strftime(date, format)
 }
@@ -35,13 +35,3 @@ export function date (this: FilterImpl, v: string | Date, format?: string, timez
 function isValidDate (date: any): date is Date {
   return (date instanceof Date || date instanceof TimezoneDate) && !isNaN(date.getTime())
 }
-
-/**
- * need pass in a `date` because offset is dependent on whether DST is active
- */
-function parseTimezoneOffset (date: Date, timeZone: string | number) {
-  if (isNumber(timeZone)) return timeZone
-  const utcDate = new Date(date.toLocaleString('en-US', { timeZone: 'UTC' }))
-  const tzDate = new Date(date.toLocaleString('en-US', { timeZone }))
-  return (utcDate.getTime() - tzDate.getTime()) / 6e4
-}

src/util/liquid-date.ts

@@ -14,6 +14,7 @@ export interface LiquidDate {
   getMonth(): number;
   getFullYear(): number;
   getTimezoneOffset(): number;
+  getTimezoneName?(): string;
   toLocaleTimeString(): string;
   toLocaleDateString(): string;
 }

src/util/strftime.ts

@@ -105,6 +105,15 @@ const padChars = {
   p: ' ',
   P: ' '
 }
+function getTimezoneOffset (d: LiquidDate, opts: FormatOptions) {
+  const nOffset = Math.abs(d.getTimezoneOffset())
+  const h = Math.floor(nOffset / 60)
+  const m = nOffset % 60
+  return (d.getTimezoneOffset() > 0 ? '-' : '+') +
+    padStart(h, 2, '0') +
+    (opts.flags[':'] ? ':' : '') +
+    padStart(m, 2, '0')
+}
 const formatCodes = {
   a: (d: LiquidDate) => dayNamesShort[d.getDay()],
   A: (d: LiquidDate) => dayNames[d.getDay()],
@@ -140,14 +149,12 @@ const formatCodes = {
   X: (d: LiquidDate) => d.toLocaleTimeString(),
   y: (d: LiquidDate) => d.getFullYear().toString().slice(2, 4),
   Y: (d: LiquidDate) => d.getFullYear(),
-  z: (d: LiquidDate, opts: FormatOptions) => {
-    const nOffset = Math.abs(d.getTimezoneOffset())
-    const h = Math.floor(nOffset / 60)
-    const m = nOffset % 60
-    return (d.getTimezoneOffset() > 0 ? '-' : '+') +
-      padStart(h, 2, '0') +
-      (opts.flags[':'] ? ':' : '') +
-      padStart(m, 2, '0')
+  z: getTimezoneOffset,
+  Z: (d: LiquidDate, opts: FormatOptions) => {
+    if (d.getTimezoneName) {
+      return d.getTimezoneName() || getTimezoneOffset(d, opts)
+    }
+    return (typeof Intl !== 'undefined' ? Intl.DateTimeFormat().resolvedOptions().timeZone : '')
   },
   't': () => '\t',
   'n': () => '\n',

src/util/timezone-date.ts

@@ -1,4 +1,5 @@
 import { LiquidDate } from './liquid-date'
+import { isString } from './underscore'
 
 // one minute in milliseconds
 const OneMinute = 60000
@@ -13,13 +14,15 @@ const ISO8601_TIMEZONE_PATTERN = /([zZ]|([+-])(\d{2}):(\d{2}))$/
  */
 export class TimezoneDate implements LiquidDate {
   private timezoneOffset: number
+  private timezoneName: string
   private date: Date
   private displayDate: Date
-  constructor (init: string | number | Date | TimezoneDate, timezoneOffset: number) {
+  constructor (init: string | number | Date | TimezoneDate, timezone: number | string) {
     this.date = init instanceof TimezoneDate
       ? init.date
       : new Date(init)
-    this.timezoneOffset = timezoneOffset
+    this.timezoneOffset = isString(timezone) ? TimezoneDate.getTimezoneOffset(timezone, this.date) : timezone
+    this.timezoneName = isString(timezone) ? timezone : ''
 
     const diff = (this.date.getTimezoneOffset() - this.timezoneOffset) * OneMinute
     const time = this.date.getTime() + diff
@@ -69,6 +72,9 @@ export class TimezoneDate implements LiquidDate {
   getTimezoneOffset () {
     return this.timezoneOffset!
   }
+  getTimezoneName () {
+    return this.timezoneName
+  }
 
   /**
    * Create a Date object fixed to it's declared Timezone. Both
@@ -97,4 +103,12 @@ export class TimezoneDate implements LiquidDate {
     }
     return new Date(dateString)
   }
+  private static getTimezoneOffset (timezoneName: string, date = new Date()) {
+    const localDateString = date.toLocaleString('en-US', { timeZone: timezoneName })
+    const utcDateString = date.toLocaleString('en-US', { timeZone: 'UTC' })
+
+    const localDate = new Date(localDateString)
+    const utcDate = new Date(utcDateString)
+    return (+utcDate - +localDate) / (60 * 1000)
+  }
 }