Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Shadow DOM #290

Closed
wants to merge 4 commits into from
Closed

Shadow DOM #290

wants to merge 4 commits into from

Conversation

keichan34
Copy link
Member

@keichan34 keichan34 commented Jun 8, 2022

breaking changeになるのでデフォルトでオフになっています
data-shadow-dom="on" で有効化できます

やること

  • デフォルト値を決める←デフォルトoff. デフォルトonはbreaking changeなので次世代バージョンに検討
  • shadowじゃない地図がページに一個もないときには内の<style>を挿入する必要ない(shadow DOM内にあります) - これは多分shadowじゃない1個目の地図を初期化するときにに追加する、というように実装すると思う
  • 地図内のCSSをかけるような仕組み。<div class="geolonia"><style>...</style></div> とかかな。 data-inner-shadow-style のアトリビュートで受け付ける。<style>の弱点は2つで、scopedがないとインバリッドHTMLになる(そしてscopedは推奨されていない)のと、地図外に適用されるケースもある。

@keichan34 keichan34 marked this pull request as ready for review June 9, 2022 08:48
@keichan34 keichan34 changed the title Shadow DOM experiment Shadow DOM Jun 9, 2022
Copy link
Contributor

@kamataryo kamataryo left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

なるほど、、 一瞬 <div class="geolonia"><style scoped></style></div> で書けた方がみやすいかと思ったんですが非推奨になってたんですね。
オプトインだし機能としては入れていいかと思いました。

@keichan34
Copy link
Member Author

一旦クローズします。下記の理由で地図全体をshadow DOMに入れることを断念しています。

  • 意図的にCSSを使って地図の内部をスタイリングしている利用者がいる。特に、ポップアップは地図内なのでポップアップがスタイリングできなくなってしまう。
  • shadow DOM内にユーザーが指定するCSSを挿入するのが簡単ではないため、逆に混乱する可能性が高い

今後、部分的に入れる予定。例えばコントロールごとなど。

@keichan34 keichan34 closed this Sep 30, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Embed API 以外の CSS が邪魔されないように仕組みを考える
2 participants