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

@parcel/core: packages/@react-aria/virtualizer/src/index.ts does not export 'useVirtualizer' #6937

Closed
unional opened this issue Aug 23, 2024 · 4 comments · Fixed by #6951
Closed

Comments

@unional
Copy link
Contributor

unional commented Aug 23, 2024

Provide a general summary of the issue here

when clone, yarn install, yarn start.

more errors when running yarn build

🤔 Expected Behavior?

able to start and build

😯 Current Behavior

fail

💁 Possible Solution

No response

🔦 Context

No response

🖥️ Steps to Reproduce

OP

Version

main branch

What browsers are you seeing the problem on?

Chrome

If other, please specify.

No response

What operating system are you using?

macOS

🧢 Your Company/Team

No response

🕷 Tracking Issue

No response

@unional
Copy link
Contributor Author

unional commented Aug 23, 2024

Probably relate to #6582

yarn build have many errors, such as:

@parcel/transformer-typescript-types: Cannot find name 'global'.

  /Users/hwong/pan/adobe/react-spectrum/packages/@react-aria/utils/dist/types.d.ts:25:52
    24 | export const getOwnerDocument: (el: Element | null | undefined) => Document;
  > 25 | export const getOwnerWindow: (el: (Window & typeof global) | Element | null | undefined) => Window & typeof global;
  >    |                                                    ^^^^^^ Cannot find name 'global'.
    26 | interface Props {
    27 |     [key: string]: any;


@parcel/transformer-typescript-types: Cannot find module '@adobe/spectrum-css-temp/components/contextualhelp/vars.css' or its corresponding type declarations.

  /Users/hwong/pan/adobe/react-spectrum/packages/@react-spectrum/contextualhelp/src/ContextualHelp.tsx:18:24
    17 | import HelpOutline from '@spectrum-icons/workflow/HelpOutline';
  > 18 | import helpStyles from '@adobe/spectrum-css-temp/components/contextualhelp/vars.css';
  >    |                        ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ Cannot find module '@adobe/spectrum-css-temp/components/contextualhelp/vars.css' or its corresponding type declarations.
    19 | import InfoOutline from '@spectrum-icons/workflow/InfoOutline';
    20 | // @ts-ignore

yarn cache clean does not fix it.

> yarn build
parcel build packages/@react-{spectrum,aria,stately}/*/ packages/@internationalized/{message,string,date,number}/ packages/react-aria-components --no-optimize --config .parcelrc-build
libc++abi: terminating due to uncaught exception of type std::__1::system_error: mutex lock failed: Invalid argument
make: *** [build] Abort trap: 6

> yarn build
parcel build packages/@react-{spectrum,aria,stately}/*/ packages/@internationalized/{message,string,date,number}/ packages/react-aria-components --no-optimize --config .parcelrc-build
make: *** [build] Segmentation fault: 11

I'm on node v20.12.2. Also trying on v18.20.1

Deleting parcel cache fix the yarn start issue.

@snowystinger
Copy link
Member

if you have run build at any point, future commands may not work as imports may resolve to the built artifacts instead. It's easiest to run a make clean_all && yarn after a build before running anything else

also, if you switch between running the docs/storybooks/build/etc, you will want to clean the parcel cache rm -rf .parcel-cache because all of them use parcel and don't differentiate between caches at the moment.

i know we work on node 18 on Mac, that's what I'm using and I'm not seeing any issues.

@unional
Copy link
Contributor Author

unional commented Aug 27, 2024

Thanks. Running make clean_all && yarn fixes the yarn start issue.

However, when I run yarn build, I got many build errors:

parcel build packages/@react-{spectrum,aria,stately}/*/ packages/@internationalized/{message,string,date,number}/ packages/react-aria-components --no-optimize --config .parcelrc-build
⠋ Building index.ts...
Browserslist: caniuse-lite is outdated. Please run:
  npx update-browserslist-db@latest

@parcel/transformer-typescript-types: Property 'style' does not exist on type 'Element'.

  /home/unional/code/adobe/react-spectrum/node_modules/@react-aria/focus/src/isElementVisible.ts:21:39
    20 | 
  > 21 |   let {display, visibility} = element.style;
  >    |                                       ^^^^^ Property 'style' does not exist on type 'Element'.
    22 | 
    23 |   let isVisible = (


@parcel/transformer-typescript-types: Property 'type' does not exist on type 'EventTarget'.

  /home/unional/code/adobe/react-spectrum/node_modules/@react-aria/interactions/src/useFocusVisible.ts:293:82
    292 |   isTextInput = isTextInput ||
  > 293 |     (e?.target instanceof IHTMLInputElement && !nonTextInputTypes.has(e?.target?.type)) ||
  >     |                                                                                  ^^^^ Property 'type' does not exist on type 'EventTarget'.
    294 |     e?.target instanceof IHTMLTextAreaElement ||
    295 |     (e?.target instanceof IHTMLElement && e?.target.isContentEditable);


@parcel/transformer-typescript-types: Property 'isContentEditable' does not exist on type 'EventTarget'.

  /home/unional/code/adobe/react-spectrum/node_modules/@react-aria/interactions/src/useFocusVisible.ts:295:53
    294 |     e?.target instanceof IHTMLTextAreaElement ||
  > 295 |     (e?.target instanceof IHTMLElement && e?.target.isContentEditable);
  >     |                                                     ^^^^^^^^^^^^^^^^^ Property 'isContentEditable' does not exist on type 'EventTarget'.
    296 |   return !(isTextInput && modality === 'keyboard' && e instanceof IKeyboardEvent && !FOCUS_VISIBLE_INPUT_KEYS[e.key]);
    297 | }


@parcel/transformer-typescript-types: Property 'key' does not exist on type 'HandlerEvent'.
  Property 'key' does not exist on type 'PointerEvent'.

  /home/unional/code/adobe/react-spectrum/node_modules/@react-aria/interactions/src/useFocusVisible.ts:296:113
    295 |     (e?.target instanceof IHTMLElement && e?.target.isContentEditable);
  > 296 |   return !(isTextInput && modality === 'keyboard' && e instanceof IKeyboardEvent && !FOCUS_VISIBLE_INPUT_KEYS[e.key]);
  >     |                                                                                                                 ^^^ Property 'key' does not exist on type 'HandlerEvent'.
    Property 'key' does not exist on type 'PointerEvent'.
    297 | }
    298 | 


@parcel/transformer-typescript-types: Argument of type 'HTMLElement' is not assignable to parameter of type 'HTMLInputElement'.
  Type 'HTMLElement' is missing the following properties from type 'HTMLInputElement': accept, align, alt, autocomplete, and 55 more.

  /home/unional/code/adobe/react-spectrum/node_modules/@react-aria/interactions/src/usePress.ts:799:88
    798 |     (key === 'Enter' || key === ' ' || key === 'Spacebar' || code === 'Space') &&
  > 799 |     !((element instanceof getOwnerWindow(element).HTMLInputElement && !isValidInputKey(element, key)) ||
  >     |                                                                                        ^^^^^^^ Argument of type 'HTMLElement' is not assignable to parameter of type 'HTMLInputElement'.
    Type 'HTMLElement' is missing the following properties from type 'HTMLInputElement': accept, align, alt, autocomplete, and 55 more.
    800 |       element instanceof getOwnerWindow(element).HTMLTextAreaElement ||
    801 |       element.isContentEditable) &&


@parcel/transformer-typescript-types: Cannot find name 'process'. Do you need to install type definitions for node? Try `npm i --save-dev @types/node`.

  /home/unional/code/adobe/react-spectrum/node_modules/@react-aria/ssr/src/SSRProvider.tsx:87:9
    86 |   if (typeof React['useId'] === 'function') {
  > 87 |     if (process.env.NODE_ENV !== 'test' && !warnedAboutSSRProvider) {
  >    |         ^^^^^^^ Cannot find name 'process'. Do you need to install type definitions for node? Try `npm i --save-dev @types/node`.
    88 |       console.warn('In React 18, SSRProvider is not necessary and is a noop. You can remove it from your app.');
    89 |       warnedAboutSSRProvider = true;


@parcel/transformer-typescript-types: Cannot find name 'global'.

  /home/unional/code/adobe/react-spectrum/node_modules/@react-aria/utils/src/domHelpers.ts:6:24
    5 | export const getOwnerWindow = (
  > 6 |   el: (Window & typeof global) | Element | null | undefined
  >   |                        ^^^^^^ Cannot find name 'global'.
    7 | ): Window & typeof global => {
    8 |   if (el && 'window' in el && el.window === el) {


@parcel/transformer-typescript-types: An implementation cannot be declared in ambient contexts.

  /home/unional/code/adobe/react-spectrum/node_modules/@react-aria/table/src/index.d.ts:24:54
    23 | import {GridRowGroupAria, useGridRowGroup} from '@react-aria/grid';
  > 24 | export function useTableRowGroup(): GridRowGroupAria {
  >    |                                                      ^ An implementation cannot be declared in ambient contexts.
    25 |   return useGridRowGroup();
    26 | }


@parcel/transformer-typescript-types: Property 'value' does not exist on type 'TextFieldHTMLElementType[T]'.

  /home/unional/code/adobe/react-spectrum/node_modules/@react-aria/textfield/src/useTextField.ts:155:26
    154 |       Object.defineProperty(input, 'defaultValue', {
  > 155 |         get: () => input.value,
  >     |                          ^^^^^ Property 'value' does not exist on type 'TextFieldHTMLElementType[T]'.
    156 |         set: () => {},
    157 |         configurable: true


@parcel/transformer-typescript-types: Top-level declarations in .d.ts files must start with either a 'declare' or 'export' modifier.

  /home/unional/code/adobe/react-spectrum/node_modules/@react-stately/flags/src/index.d.ts:13:1
    12 | 
  > 13 | let _tableNestedRows = false;
  >    | ^^^ Top-level declarations in .d.ts files must start with either a 'declare' or 'export' modifier.
    14 | 
    15 | export function enableTableNestedRows() {


@parcel/transformer-typescript-types: Initializers are not allowed in ambient contexts.

  /home/unional/code/adobe/react-spectrum/node_modules/@react-stately/flags/src/index.d.ts:13:24
    12 | 
  > 13 | let _tableNestedRows = false;
  >    |                        ^^^^^ Initializers are not allowed in ambient contexts.
    14 | 
    15 | export function enableTableNestedRows() {


@parcel/transformer-typescript-types: Cannot find module 'bundle-text:./cursors/Cur_MoveToRight_9_9.svg' or its corresponding type declarations.

  /home/unional/code/adobe/react-spectrum/packages/@react-spectrum/table/src/Resizer.tsx:4:21
    3 | import {ColumnSize} from '@react-types/table';
  > 4 | import eCursor from 'bundle-text:./cursors/Cur_MoveToRight_9_9.svg';
  >   |                     ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ Cannot find module 'bundle-text:./cursors/Cur\_MoveToRight\_9\_9.svg' or its corresponding type declarations.
    5 | import ewCursor from 'bundle-text:./cursors/Cur_MoveHorizontal_9_9.svg';
    6 | import {FocusRing} from '@react-aria/focus';


@parcel/transformer-typescript-types: Cannot find module 'bundle-text:./cursors/Cur_MoveHorizontal_9_9.svg' or its corresponding type declarations.

  /home/unional/code/adobe/react-spectrum/packages/@react-spectrum/table/src/Resizer.tsx:5:22
    4 | import eCursor from 'bundle-text:./cursors/Cur_MoveToRight_9_9.svg';
  > 5 | import ewCursor from 'bundle-text:./cursors/Cur_MoveHorizontal_9_9.svg';
  >   |                      ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ Cannot find module 'bundle-text:./cursors/Cur\_MoveHorizontal\_9\_9.svg' or its corresponding type declarations.
    6 | import {FocusRing} from '@react-aria/focus';
    7 | import {GridNode} from '@react-types/grid';

Does it mean I should not run yarn build at all (as it is not mentioned in the contributing.md), or there are something else I'm missing?

btw, running yarn test is main currently has one fail test:

 FAIL  packages/@react-spectrum/labeledvalue/test/LabeledValue.test.js
  ● LabeledValue › renders correctly with RangeValue<NumberValue>

    expect(element).toHaveTextContent()

    Expected element to have text content:
      10 – 20
    Received:
      Field label10–20

      273 |     let staticField = getByTestId('test-id');
      274 |     expect(staticField).toBeInTheDocument();
    > 275 |     expect(staticField).toHaveTextContent('10 – 20');
          |                         ^
      276 |   });
      277 |
      278 |   it('attaches a user provided ref to the outer div', function () {

      at Object.toHaveTextContent (packages/@react-spectrum/labeledvalue/test/LabeledValue.test.js:275:25)

@snowystinger
Copy link
Member

yarn build is fine, it looks like it has a bunch of errors, but if you let it continue, it'll finish just fine.

the reason you're seeing the test failure is probably because you're on a different version of node from what we test on, which is 18.20.3 right now

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 a pull request may close this issue.

2 participants