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

(Issue with typescript) TypeError: Converting circular structure to JSON #11582

Closed
icecream17 opened this issue Oct 24, 2021 · 2 comments
Closed

Comments

@icecream17
Copy link

Describe the bug

If for some reason, you type props as null and return null in render

// Null.tsx
import React from "react";

export default class Null extends React.Component<null> {
   render() {
      return null
   }
}

and then use that component with children (implicitly sets this.props.children):

// index.tsx
import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import reportWebVitals from './reportWebVitals';
import Null from './Null';

ReactDOM.render(
  <React.StrictMode>
    <Null>
      <App />
    </Null>
  </React.StrictMode>,
  document.getElementById('root')
);

// If you want to start measuring performance in your app, pass a function
// to log results (for example: reportWebVitals(console.log))
// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals
reportWebVitals();

the resulting error crashes npm start

Did you try recovering your dependencies?

(Write your answer here.)

my-ts-app-2: npm --version gets 8.1.1
solver: yarn --version gets 3.0.2

Which terms did you search for in User Guide?

(Write your answer here if relevant.)

Environment

(paste the output of the command here.)

PS C:\Users\Steven\Documents\code\js\sudoku\my-ts-app-2> npx create-react-app --info

Environment Info:

  current version of create-react-app: 5.0.0-next.47+1465357b
  running from C:\Users\Steven\Documents\code\js\sudoku\my-ts-app-2\node_modules\create-react-app

  System:
    OS: Windows 10 10.0.19042
    CPU: (4) x64 Intel(R) Core(TM) i5-3470 CPU @ 3.20GHz
  Binaries:
    Node: 16.11.1 - C:\Program Files\nodejs\node.EXE    
    Yarn: 1.22.17 - ~\AppData\Roaming\npm\yarn.CMD
    npm: 8.1.1 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Chrome: 94.0.4606.81
    Edge: Spartan (44.19041.1266.0), Chromium (95.0.1020.30)
    Internet Explorer: Not Found
  npmPackages:
    react: ^17.0.2 => 17.0.2
    react-dom: ^17.0.2 => 17.0.2
    react-scripts: 5.0.0-next.47 => 5.0.0-next.47+1465357b
  npmGlobalPackages:
    create-react-app: Not Found

Steps to reproduce

(Write your steps here:)

  1. npx create-react-app@next --scripts-version=@next --template=typescript@next my-ts-app
  2. cd my-ts-app
  3. In the src folder, create Null.tsx as shown above and edit index.tsx as shown above

Expected behavior

(Write what you thought would happen.)

Errors but doesn't crash typescript itself

Actual behavior

I don't think typescript is supposed to crash

(Write what happened. Please add screenshots!)

Before typing props as null
image

After
image

Reproducible demo

(Paste the link to an example project and exact instructions to reproduce the issue.)

icecream17/my-ts-app-2@9aa67c5

@stale
Copy link

stale bot commented Jan 9, 2022

This issue has been automatically marked as stale because it has not had any recent activity. It will be closed in 5 days if no further activity occurs.

@stale stale bot added the stale label Jan 9, 2022
@icecream17
Copy link
Author

probably fixed by microsoft/TypeScript#47604 (haven't checked)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

1 participant