Javascriptでカウントダウンを作るsafariでは挙動が違う

JavaScriptである時間になると公開されるように設定をしたい。

JSで設定する内容

・公開したい時間
・現在の時間
・挙動を起こす分岐

現在の時間を取得

const hoge = new Date();

公開したい時間を設定

const goal = new Date('2021/11/14 00:00:00');

もしくは

const goal = new Date('2021-11-14 00:00:00');

ここで注意が必要！
2つめの書き方では、safariでエラーが出てしまう。

なぜsafariではエラーになるのか？

・safariでは時間のハイフンをうまく処理できない
※正確にはスラッシュは半角として処理して判断されるがハイフンではエラーとなってしまう。

その為、safariを考えて時間設定を考え直す。

スラッシュを使う場合

const goal = new Date('2021/11/14 00:00:00');

ハイフンを使う場合

const goal = ’2021-11-14 00:00:00'; const now = new Date(goal.replace(/-/g, "/"));

※正規表現でハイフンを置換しなければいけない。

CMSを使っていない案件で、深夜での更新作業など、人的リソースの負担が大きい作業も、このようなJSをで対処できるようになる。

今回は公開日のカウントダウンがしたいとの要望からスタートしたが、打ち合わせえを重ね、要望が増えこのような時限公開式JSを組むことになった。
まあ、これで今後同じような案件に対して、注意点や作業工数が明確になったのでかなり勉強になりました。