Event Countdown Block: Countdown not showing on iOS/Safari

[rw-ye]

Quick summary

The Event countdown block does not show a countdown when viewed from iOS/Safari

Asked HEs to test in Slack: p1639883276147800-slack-C03TY6J1A

Steps to reproduce

1. Create a new page, or open an existing page.
2. Add the Event Countdown block to the page.
3. Publish page.
4. View page on an iOS device with Safari browser.
5. The numbers for the countdown timer are missing.

What you expected to happen

The countdown numbers to show.

What actually happened

None of the numbers are showing on the countdown timer.

Context

Customer report here: 4623075-zd-woothemes

Simple, Atomic or both?

Simple

Theme-specific issue?

No response

Browser, operating system and other notes

Device: iOS 14/15

Browser: Safari

Reproducibility

Consistent

Severity

No response

Available workarounds?

No response

Workaround details

No response

[jorpdesigns]

Same issue reported in 33306032-hc.

[NoHopeRadio]

Another report in 23591328-hc

[hngdny]

Another report in 4646154-zen

[the-misha]

Also here: 4629479-zd-woothemes

[adelineyaw]

I'm getting the same results on Android, reported here: 4676726-zen

[gabriel-fuentes]

Another report here: 4696079 -zd

[taipeicoder]

Another report in 4692420-zen.

The issue might be because mobile devices tend to mutate "potential" phone numbers by injecting additional HTML. In the cases I've observed, what's supposed to be:

<div data-carousel-extra="..." class="event-countdown__date">1648296000</div>

Is mutated to:

<div data-carousel-extra="..." class="event-countdown__date"><a href="tel:1648296000">1648296000</a></div>

As result, the following code section would fail to parse what it assumes to be a valid timestamp string.

[csabarakasz]

Same issue: 4736871-zd-woothemes

[gabriel-fuentes]

Another report here: 4756858-zen

[mriyazuddin]

4808269-zen

[mriyazuddin]

4837153-zd

[csabarakasz]

5227650-zd-woothemes

[edwinho89]

• [ ] 5294515-zd-woothemes