web-infra-dev / rsdoctor

A one-stop build analyzer for Rspack and webpack.
https://rsdoctor.dev/
MIT License
424 stars 33 forks source link

[Bug]: invalid height and contents of Loaders Analysis #518

Closed artus9033 closed 2 weeks ago

artus9033 commented 2 weeks ago

Version

System:
    OS: macOS 14.6.1
    CPU: (12) arm64 Apple M2 Pro
    Memory: 270.19 MB / ...
    Shell: 5.9 - /bin/zsh
  Browsers:
    Chrome: 129.0.6668.59
    Edge: 128.0.2739.79
    Safari: 17.6
    Safari Technology Preview: 18.0
  npmPackages:
    @rsdoctor/rspack-plugin: ^0.4.1 => 0.4.1

Details

When compilation fails (error due to a bug in flow parser, tracked in https://github.com/facebook/flow/pull/9208), the "Compile Analysis -> Loaders Analysis -> Loaders Analysis" panel displays a malformed editor for the file causing the error. The height of this editor is set to just a few pixels, as well as the contents seem to be invalid. At the same time, side-by-side editors for other files work properly.

Screenshot of the error in CLI when building: image

Screenshot of rsdoctor GUI: image

...and monaco editor container in rsdoctor's GUI, in the elements inspector:

image

(note to the above screen: more elements have this faulty height)

The faulty contents (editor resized manually in elements inspector to show the actual contents) seem to be the partially-transformed file, but uppercase, and a stack trace of the parser error below it:

[Error:/**
 * COPYRIGHT (C) META PLATFORMS, INC. AND AFFILIATES.
 *
 * THIS SOURCE CODE IS LICENSED UNDER THE MIT LICENSE FOUND IN THE
 * LICENSE FILE IN THE ROOT DIRECTORY OF THIS SOURCE TREE.
 *
 * @FLOW STRICT-LOCAL
 * @FORMAT
 */

IMPORT TYPE {EVENTSUBSCRIPTION} FROM '../../../LIBRARIES/VENDOR/EMITTER/EVENTEMITTER';
IMPORT TYPE {EVENTCONFIG} FROM '../../../LIBRARIES/ANIMATED/ANIMATEDEVENT';
IMPORT TYPE {
  ANIMATIONCONFIG,
  ENDCALLBACK,
} FROM '../../../LIBRARIES/ANIMATED/ANIMATIONS/ANIMATION';
IMPORT TYPE {
  ANIMATEDNODECONFIG,
  EVENTMAPPING,
} FROM '../../../LIBRARIES/ANIMATED/NATIVEANIMATEDMODULE';

IMPORT * AS REACTNATIVEFEATUREFLAGS FROM '../FEATUREFLAGS/REACTNATIVEFEATUREFLAGS';
IMPORT NATIVEEVENTEMITTER FROM '../../../LIBRARIES/EVENTEMITTER/NATIVEEVENTEMITTER';
IMPORT RCTDEVICEEVENTEMITTER FROM '../../../LIBRARIES/EVENTEMITTER/RCTDEVICEEVENTEMITTER';
IMPORT PLATFORM FROM '../../../LIBRARIES/UTILITIES/PLATFORM';
IMPORT NATIVEANIMATEDNONTURBOMODULE FROM '../../../LIBRARIES/ANIMATED/NATIVEANIMATEDMODULE';
IMPORT NATIVEANIMATEDTURBOMODULE FROM '../../../LIBRARIES/ANIMATED/NATIVEANIMATEDTURBOMODULE';
IMPORT INVARIANT FROM 'INVARIANT';
IMPORT NULLTHROWS FROM 'NULLTHROWS';

// TODO T69437152 @PETETHEHEAT - DELETE THIS FORK WHEN FABRIC SHIPS TO 100%.
CONST NATIVEANIMATEDMODULE: TYPEOF NATIVEANIMATEDTURBOMODULE =
  NATIVEANIMATEDNONTURBOMODULE ?? NATIVEANIMATEDTURBOMODULE;

LET __NATIVEANIMATEDNODETAGCOUNT = 1; /* USED FOR ANIMATED NODES */
LET __NATIVEANIMATIONIDCOUNT = 1; /* USED FOR STARTED ANIMATIONS */

LET NATIVEEVENTEMITTER;

LET WAITINGFORQUEUEDOPERATIONS = NEW SET<STRING>();

[...]

  136 |     : (tag, saveValueCallback) => {
  137 |         NativeOperations.getValue(tag, saveValueCallback);
> 138 |       }) as $NonMaybeType<typeof NativeAnimatedModule>['getValue'],
      |          ^
  139 |
  140 |   setWaitingForIdentifier(id: string): void {
  141 |     waitingForQueuedOperations.add(id);
 Error Stack:
SyntaxError: /substituted/path/to/my/project/node_modules/.pnpm/react-native@0.76.0-rc.1_@babel+core@7.25.2_@babel+preset-env@7.25.4_@babel+core@7.25.2__@rea_vlse775u3jppwlbpw3wmuggq3u/node_modules/react-native/src/private/animated/NativeAnimatedHelper.js: Unexpected token, expected "," (138:9)

  136 |     : (tag, saveValueCallback) => {
  137 |         NativeOperations.getValue(tag, saveValueCallback);
> 138 |       }) as $NonMaybeType<typeof NativeAnimatedModule>['getValue'],
      |          ^
  139 |
  140 |   setWaitingForIdentifier(id: string): void {
  141 |     waitingForQueuedOperations.add(id);
    at constructor 
[...]

Reproduce link

https://github.com/callstack/repack/commit/bdd10466aacc05722961c1722bc063a1d84fac04

Reproduce Steps

  1. pnpm i
  2. cd apps/tester-app
  3. RSDOCTOR=1 pnpm start --platform ios
artus9033 commented 2 weeks ago

Closing for now, will re-confirm on a clean setup, since it works on a different device with same setup.