Skip to content

Support setting Context displayName in @babel/plugin-transform-react-display-name #11241

@kentcdodds

Description

@kentcdodds

Feature Request

  • I would like to work on this feature!
  • I have bandwidth to work on this feature in the near future. 🙁

Is your feature request related to a problem? Please describe.

Here's an example of React DevTools with a few context providers and consumers:

image

You'll notice that the context consumer and provider rendered under ThemeProvider have generic Context.Consumer and Context.Provider display names, but there's also a Router.Provider and Router.Consumer in there which are much more clear.

They accomplish this by setting the context's displayName value.

Here are some test cases:

import React from 'react'

const MyContext = React.createContext()
MyContext.displayName = 'MyContext'

Describe the solution you'd like

I'd like @babel/plugin-transform-react-display-name to support automatically setting the displayName property for contexts.

Describe alternatives you've considered

I can set it manually. Not desirable. Or I could write my own babel plugin, but then others wouldn't benefit from it if they either don't know about the plugin or can't install it. Also, this seems to make a lot of sense to be included here to me.

Teachability, Documentation, Adoption, Migration Strategy

No need, it'll just magically start working and people will be pleasantly surprised.

Metadata

Metadata

Assignees

No one assigned

    Labels

    area: reactoutdatedA closed issue/PR that is archived due to age. Recommended to make a new issue

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions