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

[Web LA] Fix null elements error #5881

Merged
merged 1 commit into from
Apr 24, 2024
Merged

[Web LA] Fix null elements error #5881

merged 1 commit into from
Apr 24, 2024

Conversation

m-bert
Copy link
Contributor

@m-bert m-bert commented Apr 9, 2024

Summary

This PR includes the following changes:

  1. Start exiting animation only if component is defined (to avoid issues related to null).
  2. Call fixElementPosition only when parent is defined.

These checks are expected to eliminate cannot read properties of null error.

Origin of this PR

This PR originates from discussion on discord, where it was reported that layout animations crash on web when using react-navigation and expo-router. Crashes happen when display: none; is set. We are not sure what is the exact cause of this issue. However, our main suspect is MutationObserver inside domUtils.ts. Also, we don't know why element is null, but we believe that it can happen because of this line, since this is the only place where we assign something to _component.

Snippet from discord

The snippet provided on discord looks like this:

    <Animated.View
      className="flex flex-row md:hidden px-3 border-b border-b-zinc-800 h-11"
      entering={FadeIn.duration(600)}
      exiting={FadeOut}
    >

As you can tell it uses Tailwind. Unfortunately it doesn't help much.

Error message

Original error message looks like this:

image

By looking at this error we were able to identify that the crash happens during exiting animation. We still don't know which one is null in this case - parent or element.

Test Plan

We struggle to prepare a reproduction as it is very rare problem. However, I believe that the changes are effective.

@m-bert m-bert requested a review from piaskowyk April 9, 2024 15:52
@piaskowyk
Copy link
Member

We also need to investigate the cause of the issue. If it's a race condition, it would be beneficial to determine the root cause. If it's undefined, there might be a specific point where the breakdown occurs.

@m-bert m-bert added this pull request to the merge queue Apr 24, 2024
Merged via the queue into main with commit 9ab071e Apr 24, 2024
8 checks passed
@m-bert m-bert deleted the @mbert/fix-null-element branch April 24, 2024 14:37
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.

2 participants