カードのサマリ部分の集計日等の日付がtime要素でマークアップされていない

[yosukedoke]

起こっている問題 / The Problem

• カードのサマリ部分の集計日等の日付がtime要素でマークアップされていない

該当箇所一覧（日本語のみ）

• https://stopcovid19.metro.tokyo.lg.jp/cards/number-of-reports-to-tokyo-fever-consultation-center/
• https://stopcovid19.metro.tokyo.lg.jp/cards/monitoring-number-of-reports-to-covid19-consultation-desk/
• https://stopcovid19.metro.tokyo.lg.jp/cards/number-of-reports-to-covid19-telephone-advisory-center/
• https://stopcovid19.metro.tokyo.lg.jp/cards/positive-number-by-diagnosed-date/
• https://stopcovid19.metro.tokyo.lg.jp/cards/positive-number-by-developed-date/
• https://stopcovid19.metro.tokyo.lg.jp/cards/number-of-confirmed-cases-by-municipalities/

※ 各言語においても同様

スクリーンショット / Screenshot

期待する見せ方・挙動 / Expected Behavior

• time要素でマークアップする

起こっている問題の再現手段 / Steps to Reproduce

1. デベロッパーツールでマークアップを確認する

動作環境・ブラウザ / Environment

• すべての環境

[yosukedoke]

下部の注釈内の日付がtimeでマークアップされていない。
についても可能な範囲で対応したほうが良いと思われるが、文脈的に可能な範囲で検討ください。

• https://stopcovid19.metro.tokyo.lg.jp/cards/attributes-of-confirmed-cases/
• https://stopcovid19.metro.tokyo.lg.jp/cards/monitoring-number-of-reports-to-covid19-consultation-desk/

[Meiryo7743]

<time> でマークアップする際は，datetime 属性に（2021-01-01T00:00:00+0900のような書式で）日時を併記するとさらに良いと思われます。

cf. https://developer.mozilla.org/en-US/docs/Web/HTML/Element/time#usage_notes

[yamanoku]

実際の表記箇所は以下のようにマークアップされている

<small class="DataView-DataSet-date">{{ sText }}</small>

components/index/CardsReference/PositiveNumberByDevelopedDate/Card.vue
props である sText は以下のように書かれているので

sText: `${formattedLastDay} ${this.$t('日別値')}（${this.$t(
  '現在判明している人数であり、後日修正される場合がある'
)}）`,

formattedLastDay を <time> で分けられるように sText を渡したあとに分離するか
props で渡す時に formattedLastDay を別で渡すようにするかなどの対応が必要そう

[kaizumaki]

@Meiryo7743 @yamanoku フォローおよびご提案ありがとうございます！

たしかに、formattedLastDay を components/index/_shared/DataViewDataSetPanel.vue のpropsにするのがよいかもしれません。

[kaizumaki]

こちら対応しますね。

[kaizumaki]

propsで渡す方法を考えていたのですが、多言語化のあたりでうまくいかないような気がしてきました。
例えば、この↓場合はうまくいきそうなのですが、

2021年7月19日 日別値

この↓場合は助詞を含むので、単純にtimeタグに渡すだけだと、翻訳時にうまくいきません（特に英語）。

2021年7月19日 の数値

類似してこの↓ようなパターンもあり、

2021年6月28日から2021年7月4日までの期間の数値

ちょっと一筋縄ではいかないようです。
無理矢理に v-html でhtmlをエスケープしない方法はありますが、やはりそれはあまりやりたくない気持ちもあり。

@magi1125 @masuP9 もしtimeマークアップを対応するなら、記述を変える（助詞を使わない表現にする）しかないかなと思うのですが、どう思われますか？

[magi1125]

@kaizumaki なるほどー。ここは無理にtime要素使わなくてもいいと思いますのでいったん保留でいいかと思います。