You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
a 태그(react-router의 Link 컴포넌트 포함) 안에서 smooth-corners가 동작하지 않는 문제.
체크해보니, 정상적으로 스크립트 register는 되지만(registerPaint('smooth-corners', SmoothCorners)) 스크립트 내부의 paint 메서드는 실행되지 않는 걸 확인했음.
개발자 도구로 확인 시 background: paint(smooth-corners), --smooth-corners 정상 적용되는 것도 확인. 앵커 태그의 내부 구현과 CSS Paint Worklet 이 어디선가 충돌하지 않나 생각됨.
크로미움에서 링크에 paint()를 적용 시, 방문 정보가 누출될 위험이 있어 문제가 해결될 때까지 모든 앵커에 대해서 Paint Worklet을 비활성화하도록 결정했다고 합니다.
This is actually intentional, to mitigate with a privacy leak that could happen if one were to paint :visited links. Here is a specs issue discussing this.
Basically an evil website could tell which link has been visited by applying a paint() only for such links and check if the PaintWorklet has been called.
So the current solution Chrome's team came with was to simply disable the PaintWorklet for all anchors with an href attribute, that is until the root problem gets properly addressed (but this will take time).
현재상황
a
태그(react-router의Link
컴포넌트 포함) 안에서 smooth-corners가 동작하지 않는 문제.체크해보니, 정상적으로 스크립트 register는 되지만(
registerPaint('smooth-corners', SmoothCorners)
) 스크립트 내부의 paint 메서드는 실행되지 않는 걸 확인했음.개발자 도구로 확인 시
background: paint(smooth-corners)
,--smooth-corners
정상 적용되는 것도 확인. 앵커 태그의 내부 구현과 CSS Paint Worklet 이 어디선가 충돌하지 않나 생각됨.결론
관련 이슈: w3c/css-houdini-drafts#791
크로미움에서 링크에 paint()를 적용 시, 방문 정보가 누출될 위험이 있어 문제가 해결될 때까지 모든 앵커에 대해서 Paint Worklet을 비활성화하도록 결정했다고 합니다.
참고
재현 방법
자손, 자식 관계에 상관없이 smooth-corners를 사용하는 컴포넌트(21-06-23 기준 현재는 Avatar만)가 앵커 태그 내부에 위치할 경우 이미지가 투명하게 보임.
기대한 동작
이미지가 잘 보여야 함.
실제 동작
투명하게 보임.
Reference
The text was updated successfully, but these errors were encountered: