React Calendar gives Error on Internet Explorer 11 - reactjs

I am new to SP dev fx components and have used react-calendar linked react-calendar. I works fine on Chrome, Firefox but gives error
Object doesn't support property or method 'from'
on Internet Explorer. I have seen that it is because of Polyfill not supported with IE11. I tried to add
import 'core-js/modules/es6.promise'
import 'whatwg-fetch'
import 'core-js/modules/es6.array.iterator.js'
import 'core-js/modules/es6.array.from.js'
import 'es6-map/implement'
but got this error now
in Uncontrolled(Component)in ForwardRefin divin divin divin Unknownin Unknown
I am very new to this and not sure where else to look. Can anyone suggest me what wrong has happened.
Regards,
Saghir

Related

React attempted import error in node module

I'm receiving the next error when trying to run my application, the package.json use node v12.x and my version installed is v16.17.0
./node_modules/#reactour/tour/dist/tour.esm.js
Attempted import error: 'Portal' is not exported from '#reactour/utils'
I tried to update the #reactour/utils to v3.1.6 but there are many breaking changes that I cannot deal with them right now, so I need to make it works with version
"#reactour/tour": "^2.13.0"
Any suggestions or workarounds?
it is a default export, import it like this :
import Portal from '#reactour/utils'

React app throwing errors when using 'react-pdf'

I've been having trouble getting react-pdf to work properly in my react app that I created using 'create-react-app'. From various github comments on the react-pdf page, it seems that there's an issue setting up the workerSrc in React applications that were created with 'create-react-app'.
One work around that seemed to solve the issue (temporarily) was to copy the pdf.worker.js file from the node-modules/build/pdfjs-dist/build folder and place it in the public folder of my react app. Then in my index.js file put the following code:
import {pdfjs} from 'react-pdf'
window.PDFJS.workerSrc = process.env.PUBLIC_URL + '/pdf.worker.js'
This worked just fine for a week, until I installed a new module into my application with npm. Now, I'm getting the same error I did in the beginning, and nothing has changed:
index.js:14 Uncaught TypeError: Cannot set property 'workerSrc' of undefined
These were the initial comments that helped me narrow down the error:
https://github.com/facebook/create-react-app/issues/1574#issuecomment-280436498
https://github.com/wojtekmaj/react-pdf/issues/291
but now that it's back I'm kind of at a loss for ideas. Has anyone else experienced this and been able to solve it? Any help would be greatly appreciated!
Based on what I have seen in the docs and in forums, it appears you should be altering the global PDFJS object.
PDFJS.workerSrc, instead of window.workerSrc.
I managed to get this working by loading the worker from CDN.
import { Document, Page, pdfjs } from 'react-pdf';
pdfjs.GlobalWorkerOptions.workerSrc=//cdnjs.cloudflare.com/ajax/libs/pdf.js/${pdfjs.version}/pdf.worker.js

React Native: 'undefined is not an object (evaluating '_react3.PropTypes.bool')

I have recently tried to export my react native project to expo. Although, it had updated react-native, and now get an error of 'undefined is not an object (evaluating '_react3.PropTypes.bool')'
I have looked to solve this and found that I need to import proptypes - import PropTypes from 'prop-types'; which ive added in all my scripts, still the error message persists. Moreover, I dont use any proptypes, so I dont get why i would get this error in the first place.
If you would like to take a look at the proj, please do - https://github.com/rasselll/probs
The error is clearly mentioned in the log and is due to react-native-view-transformer library.
The library still uses the PropTypes package from react. Since your react version is higher that v15.5 therefore it is giving an error.
Here's a file from the package that is still using the deprecated version of propTypes

angular2 app crashing on IE 11

I am facing one app crash issue in ie11. App is working fine with all browsers but IE.
on some post I found to uncomment the following lines in polyfills.ts
/** IE9, IE10 and IE11 requires all of the following polyfills. **/
import 'core-js/es6/symbol';
import 'core-js/es6/object';
import 'core-js/es6/function';
import 'core-js/es6/parse-int';
import 'core-js/es6/parse-float';
import 'core-js/es6/number';
import 'core-js/es6/math';
import 'core-js/es6/string';
import 'core-js/es6/date';
import 'core-js/es6/array';
import 'core-js/es6/regexp';
import 'core-js/es6/map';
import 'core-js/es6/weak-map';
import 'core-js/es6/set';
After un-commenting these lines application is working on IE 11.0.38 (KB203621).
But it is still crashing on IE 11.0.96 (KB4040685). Browser itself stops working while trying to load the app.
If anybody have faced this kind of issue before, please provide your valuable suggestions to resolve this issue.
Thanks & Regards,
Most ES6 features are not supported in IE 11.
take a look at this to get an idea https://kangax.github.io/compat-table/es6/

Firebase initial error with React Native (Cannot read property 'getItem' of undefined)

I am developing a mobile app with React native and trying to use firebase as a database. Yesterday I tried to upgrade my React native version from 0.37 to 0.40 but some files conflicted and my app didnt start. So I reverted to version 0.37. ( I copy pasted conflicted files with my earliest copies to solve this)
Now, when I copy paste firebase code snippet to my App.js file to setup firebase, I get an error "Cannot read property 'getItem' of undefined"
If I remove firebase snippet everything works fine. Otherwise after 1-2 seconds red screen pops up with the error on attachments.
I am suspecting, I broke something on the way to reverting react native 0.37. I tried to uninstall and reinstall firebase with no avail. Now I am beating my head and any help would be greatly appreaciated.
I found a solution to my problem. It seems that problem is not with firebase but its because of chrome debugger. Having the 'device toggle toolbar' (CMD SHIFT M) enabled in chrome seems to be causing the problem. De-selecting 'device toggle toolbar' and reloading the emulator gets rid of the error.
Check the image link for sample please.

Resources