Skip to content

fix(drawing): fix blur not visible for drawn annotation in Safari#675

Merged
ChenCodes merged 12 commits intobox:masterfrom
ChenCodes:blur-not-visible-for-drawn-annotation-in-safari
Jan 22, 2021
Merged

fix(drawing): fix blur not visible for drawn annotation in Safari#675
ChenCodes merged 12 commits intobox:masterfrom
ChenCodes:blur-not-visible-for-drawn-annotation-in-safari

Conversation

@ChenCodes
Copy link
Contributor

Main Issue:
In Safari, we noticed that newly drawn annotations were not receiving a blur effect from the filter element in the SVG on hover.
After closer inspection, it looks like we were using a common identifier for the element in DrawingSVG. Safari actually did the right thing in displaying the UI bug as using a common identifier for different elements should result in a buggy experience.

Here is the article that talked about a similar issue for what we were experiencing: https://css-tricks.com/heres-how-i-solved-a-weird-bug-using-tried-and-true-debugging-strategies/

Solution:
The solution is to assign a unique identifier to each instance of a filter that is being used.

Demo:
ezgif com-gif-maker (4)

@ChenCodes ChenCodes marked this pull request as ready for review January 21, 2021 22:20
@ChenCodes ChenCodes requested a review from a team as a code owner January 21, 2021 22:20
@ChenCodes ChenCodes merged commit 52f22ee into box:master Jan 22, 2021
@ChenCodes ChenCodes deleted the blur-not-visible-for-drawn-annotation-in-safari branch January 22, 2021 01:02
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.

3 participants