Invalid Authentication Type

[drcrook1]

Simply following the starter code and getting the following errors:

`react-azure-maps.es5.js:55

   Error: An invalid authentication type was specified.
at react-azure-maps.es5.js:55:1
at new Promise (<anonymous>)
at Rf.initialize (react-azure-maps.es5.js:55:1)
at new tg (react-azure-maps.es5.js:55:1)
at react-azure-maps.es5.js:55:1
at commitHookEffectListMount (react-dom.development.js:23150:1)
at commitPassiveMountOnFiber (react-dom.development.js:24926:1)
at commitPassiveMountEffects_complete (react-dom.development.js:24891:1)
at commitPassiveMountEffects_begin (react-dom.development.js:24878:1)
at commitPassiveMountEffects (react-dom.development.js:24866:1)

qf._invokeListeners @ react-azure-maps.es5.js:55
qf.invoke @ react-azure-maps.es5.js:55
(anonymous) @ react-azure-maps.es5.js:55
Promise.catch (async)
tg @ react-azure-maps.es5.js:55
(anonymous) @ react-azure-maps.es5.js:55
commitHookEffectListMount @ react-dom.development.js:23150
commitPassiveMountOnFiber @ react-dom.development.js:24926
commitPassiveMountEffects_complete @ react-dom.development.js:24891
commitPassiveMountEffects_begin @ react-dom.development.js:24878
commitPassiveMountEffects @ react-dom.development.js:24866
flushPassiveEffectsImpl @ react-dom.development.js:27039
flushPassiveEffects @ react-dom.development.js:26984
performSyncWorkOnRoot @ react-dom.development.js:26076
flushSyncCallbacks @ react-dom.development.js:12042
commitRootImpl @ react-dom.development.js:26959
commitRoot @ react-dom.development.js:26682
finishConcurrentRender @ react-dom.development.js:25981
performConcurrentWorkOnRoot @ react-dom.development.js:25809
workLoop @ scheduler.development.js:266
flushWork @ scheduler.development.js:239
performWorkUntilDeadline @ scheduler.development.js:533
react-azure-maps.es5.js:55

   Error: An invalid authentication type was specified.
at react-azure-maps.es5.js:55:1
at new Promise (<anonymous>)
at Rf.initialize (react-azure-maps.es5.js:55:1)
at new tg (react-azure-maps.es5.js:55:1)
at react-azure-maps.es5.js:55:1
at commitHookEffectListMount (react-dom.development.js:23150:1)
at invokePassiveEffectMountInDEV (react-dom.development.js:25154:1)
at invokeEffectsInDev (react-dom.development.js:27351:1)
at commitDoubleInvokeEffectsInDEV (react-dom.development.js:27330:1)
at flushPassiveEffectsImpl (react-dom.development.js:27056:1)

qf._invokeListeners @ react-azure-maps.es5.js:55
qf.invoke @ react-azure-maps.es5.js:55
(anonymous) @ react-azure-maps.es5.js:55
Promise.catch (async)
tg @ react-azure-maps.es5.js:55
(anonymous) @ react-azure-maps.es5.js:55
commitHookEffectListMount @ react-dom.development.js:23150
invokePassiveEffectMountInDEV @ react-dom.development.js:25154
invokeEffectsInDev @ react-dom.development.js:27351
commitDoubleInvokeEffectsInDEV @ react-dom.development.js:27330
flushPassiveEffectsImpl @ react-dom.development.js:27056
flushPassiveEffects @ react-dom.development.js:26984
performSyncWorkOnRoot @ react-dom.development.js:26076
flushSyncCallbacks @ react-dom.development.js:12042
commitRootImpl @ react-dom.development.js:26959
commitRoot @ react-dom.development.js:26682
finishConcurrentRender @ react-dom.development.js:25981
performConcurrentWorkOnRoot @ react-dom.development.js:25809
workLoop @ scheduler.development.js:266
flushWork @ scheduler.development.js:239
performWorkUntilDeadline @ scheduler.development.js:533`

Code I am using is pretty straight forward and simple...

`import React, { useState } from "react";
import {
AzureMap,
AzureMapsProvider,
IAzureMapOptions,
} from "react-azure-maps";
import { AuthenticationType } from "azure-maps-control";

function HomePage() {
const { option } = {
authOptions: {
authType: AuthenticationType.subscriptionKey,
subscriptionKey: "MYSUBSCRIPTIONKEY", // Your subscription key
},
};

return (

Welcome to Home Page

<div style={{ height: "300px" }}>

);
}

export default HomePage;`

[drcrook1]

[Vedantthakkar]

I am facing the same issue. Do we have a work around for this till the bug is fixed?

[yulinscottkang]

Fixed in 0.4.6.