Hacktoberfest 2026:メンテナが10月に向けて印を付けた、オープンで初心者向けの issue。 Hacktoberfest の issue を見る

[BUG]On Microsoft Edge paths disconnect stroke from fill if stroke width is more than 15

オープン
#205 コメント 5 件 リアクション 0 件 担当者 0 名 GitHub で見る

メンテナーはふだん 1 日以内に返信

まだ誰も着手していません。

評価

難易度
3/5
見積もり時間
1〜2日
初心者へのやさしさ
52/100
issue の種類
バグ
明瞭さ
おおむね明確
活発さ
活発
技術スタック
javascript
領域
frontend

調査の方向性

Microsoft Edge で楕円ツールを使い、線幅を 16 以上にして問題を再現し、その結果を Chrome と比較します。まず、線幅のハンドラーと、レポートで言及されている Paper.js との潜在的な相互作用を調べます。楕円とパスのストロークが大きな幅でも塗りつぶしに接続されたままになれば完了です。

索引モデルが issue の本文から書いたものです。

説明

bug

Describe the bug
If you make a new ellipse with stroke width > 16, the path results in the ellipses shown in the below screenshots. Console logs nothing at all. You cannot use a rectangle to reproduce the bug unless you use the path cursor.
You might want to play around with the reproduction instructions a bit, since there's a bunch of different ways to reproduce this bug that I know of (and there's probably more).

To reproduce
One set of steps to reproduce the behavior:

  1. Set stroke width to 16 or more
  2. Try and make an ellipse
  3. You will see that the resulting path is as shown in the screenshot (the paths that are normal have strokes of less than 16)
    You can also reproduce by creating a normal, bug-free circular path and setting the stroke width to a sufficiently large number depending on the size of the path.
    Yet another way to reproduce is to take any path with four or less points, make up to three of the points curved (with the path cursor), and reduce the size for a bit.

Expected behavior
The paths render with connected strokes and fills.

Screenshots
Image

Image the rectangle actually resulted from the ellipse tool making a very small oval

Editor version
1.19.3 onwards

Device

  • Lenovo AIO Desktop
  • Windows 11
  • Microsoft Edge

Suggested fixes
I think this is either coming from the stroke width handlers or a paperjs quirk.

Additional context
Weirdly, this seems to be an Edge thing. I tried reproducing on Chrome but it didn't do anything weird.

主要言語
JavaScript
スター
53
フォーク
22
平均マージ
2日 10時間
マージ済み PR(30日)
12

環境構築

このプロジェクトには開発コンテナ、Dockerfile、コントリビューションガイドがありません。まず README を読み、一般的な手順ははじめてのコントリビューションガイドを参照してください。

はじめの一歩

  1. issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
  2. 着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
  3. リポジトリをフォークし、ブランチを切って変更します。
  4. issue 番号を参照したプルリクエストを送ります。

Candlestickers/Candlestick のほかの issue

Candlestickers/Candlestick の issue をすべて見る

似ている issue

JavaScript の issue をもっと見る

新しい issue をメールで受け取る

初心者向けの GitHub issue を短くまとめたダイジェスト。