aws-amplify / amplify-js

A declarative JavaScript library for application development using cloud services.
https://docs.amplify.aws/lib/q/platform/js
Apache License 2.0
9.43k stars 2.13k forks source link

Authenticator no more working with hideDefault #2440

Closed SebSchwartz closed 5 years ago

SebSchwartz commented 5 years ago

Describe the bug I'm using my own UI so Authentificator is set with hide default. In version > 1.1.12 (aws-amplify) and > 2.1.6 (aws-amplify-react), this is no more working.

To Reproduce My code for UI:

const AppWithClient = withApollo(App);

ReactDOM.render(
  <ErrorBoundary>
    <MuiThemeProvider theme={theme}>
      <IntlProvider>
        <Router>
          <ApolloProvider client={client}>
            <Rehydrated>
              <Authenticator
                hideDefault={true}
              >
                <AppWithClient />
              </Authenticator>
            </Rehydrated>
          </ApolloProvider>
        </Router>
      </IntlProvider>
    </MuiThemeProvider>
  </ErrorBoundary>,
  document.getElementById('root')
);

App is a simple components which renders routes and show login page if the user is not logged in.

Here is the stack trace in the console (with version 1.1.18 & 2.2.5):

Authenticator.js:256 Uncaught TypeError: props_children.find is not a function
    at Authenticator.js:256
    at Array.filter (<anonymous>)
    at Authenticator.render (Authenticator.js:255)
    at finishClassComponent (react-dom.development.js:15141)
    at updateClassComponent (react-dom.development.js:15096)
    at beginWork (react-dom.development.js:15980)
    at performUnitOfWork (react-dom.development.js:19102)
    at workLoop (react-dom.development.js:19143)
    at HTMLUnknownElement.callCallback (react-dom.development.js:147)
    at HTMLUnknownElement.sentryWrapped (index.js:3743)
    at Object.invokeGuardedCallbackDev (react-dom.development.js:196)
    at invokeGuardedCallback (react-dom.development.js:250)
    at replayUnitOfWork (react-dom.development.js:18350)
    at renderRoot (react-dom.development.js:19261)
    at performWorkOnRoot (react-dom.development.js:20165)
    at performWork (react-dom.development.js:20075)
    at performSyncWork (react-dom.development.js:20049)
    at requestWork (react-dom.development.js:19904)
    at scheduleWork (react-dom.development.js:19711)
    at Object.enqueueSetState (react-dom.development.js:12936)
    at Rehydrated.push../node_modules/react/cjs/react.development.js.Component.setState (react.development.js:356)
    at Rehydrated.<anonymous> (rehydrated.js:218)
    at step (rehydrated.js:151)
    at Object.next (rehydrated.js:81)
    at fulfilled (rehydrated.js:33)
(anonymous) @ Authenticator.js:256
Authenticator.render @ Authenticator.js:255
finishClassComponent @ react-dom.development.js:15141
updateClassComponent @ react-dom.development.js:15096
beginWork @ react-dom.development.js:15980
performUnitOfWork @ react-dom.development.js:19102
workLoop @ react-dom.development.js:19143
callCallback @ react-dom.development.js:147
sentryWrapped @ index.js:3743
invokeGuardedCallbackDev @ react-dom.development.js:196
invokeGuardedCallback @ react-dom.development.js:250
replayUnitOfWork @ react-dom.development.js:18350
renderRoot @ react-dom.development.js:19261
performWorkOnRoot @ react-dom.development.js:20165
performWork @ react-dom.development.js:20075
performSyncWork @ react-dom.development.js:20049
requestWork @ react-dom.development.js:19904
scheduleWork @ react-dom.development.js:19711
enqueueSetState @ react-dom.development.js:12936
push../node_modules/react/cjs/react.development.js.Component.setState @ react.development.js:356
(anonymous) @ rehydrated.js:218
step @ rehydrated.js:151
(anonymous) @ rehydrated.js:81
fulfilled @ rehydrated.js:33
Promise.then (async)
step @ rehydrated.js:50
(anonymous) @ rehydrated.js:53
push../node_modules/aws-appsync-react/lib/rehydrated.js.__awaiter @ rehydrated.js:30
Rehydrated.componentWillMount @ rehydrated.js:207
callComponentWillMount @ react-dom.development.js:13172
mountClassInstance @ react-dom.development.js:13270
updateClassComponent @ react-dom.development.js:15087
beginWork @ react-dom.development.js:15980
performUnitOfWork @ react-dom.development.js:19102
workLoop @ react-dom.development.js:19143
renderRoot @ react-dom.development.js:19228
performWorkOnRoot @ react-dom.development.js:20165
performWork @ react-dom.development.js:20075
performSyncWork @ react-dom.development.js:20049
requestWork @ react-dom.development.js:19904
scheduleWork @ react-dom.development.js:19711
scheduleRootUpdate @ react-dom.development.js:20415
updateContainerAtExpirationTime @ react-dom.development.js:20441
updateContainer @ react-dom.development.js:20509
push../node_modules/react-dom/cjs/react-dom.development.js.ReactRoot.render @ react-dom.development.js:20820
(anonymous) @ react-dom.development.js:20974
unbatchedUpdates @ react-dom.development.js:20292
legacyRenderSubtreeIntoContainer @ react-dom.development.js:20970
render @ react-dom.development.js:21037
./src/index.js @ index.js:105
__webpack_require__ @ bootstrap:782
fn @ bootstrap:150
0 @ unitsutils.js:37
__webpack_require__ @ bootstrap:782
checkDeferredModules @ bootstrap:45
webpackJsonpCallback @ bootstrap:32
(anonymous) @ main.chunk.js:1

index.js:1446 The above error occurred in the <Authenticator> component:
    in Authenticator (at src/index.js:112)
    in div (created by Rehydrate)
    in Rehydrate (created by Rehydrated)
    in Rehydrated (at src/index.js:111)
    in ApolloProvider (at src/index.js:110)
    in Router (created by BrowserRouter)
    in BrowserRouter (at src/index.js:109)
    in IntlProvider (at IntlProviderWrapper.js:52)
    in MuiPickersUtilsProvider (at IntlProviderWrapper.js:51)
    in IntlProviderWrapper (at src/index.js:108)
    in MuiThemeProviderOld (at src/index.js:107)
    in ErrorBoundary (at src/index.js:106)

Expected behavior Show the UI with no error.

Desktop (please complete the following information):

jordanranz commented 5 years ago

Hi @SebSchwartz,

It looks like this was fixed in a recent PR:

2421

Could you try using the latest unstable aws-amplify-react version: aws-amplify-react@2.2.6-unstable.0

SebSchwartz commented 5 years ago

Yes it's working with aws-amplify-react@2.2.6-unstable.0 version :)

Thanks for great work.

SebSchwartz commented 5 years ago

Working with 2.3.0 stable version. Closing

github-actions[bot] commented 3 years ago

This issue has been automatically locked since there hasn't been any recent activity after it was closed. Please open a new issue for related bugs.

Looking for a help forum? We recommend joining the Amplify Community Discord server *-help channels or Discussions for those types of questions.