Cannot read properties of undefined (reading 'toString') in Jest React Native - react-native

TypeError: Cannot read properties of undefined (reading 'toString')
15 | let TempLastname = route.params.lastName
16 | let TempAge = route.params.age
> 17 | let StringAge = TempAge.toString()
| ^
18 | let TempPhoto = route.params.photo
19 | const [Error,setError] = useState('')
20 | const [disableButton,setDisableButton] = useState(true)
at EditContact (components/screens/EditContact.js:17:29)
at renderWithHooks (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:6016:18)
at mountIndeterminateComponent (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:8744:13)
at beginWork (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:9966:16)
at performUnitOfWork (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:13800:12)
at workLoopSync (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:13728:5)
at renderRootSync (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:13691:7)
at performSyncWorkOnRoot (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:13404:18)
at node_modules/react-test-renderer/cjs/react-test-renderer.development.js:2537:26
at unstable_runWithPriority (node_modules/scheduler/cjs/scheduler.development.js:468:12)
I tried to make a snap test using jest, but i found this problem, can someone help me?
the code test :
describe('Testing Edit Contact snaps',()=>{
test('render corretly',()=>{
const mockedparams = {
route:{params : {itemID:'route.params.itemID'}},
navigation:''
}
const tree = create(
<Provider store={store}>
<EditContact navigation={navigation} {...mockedparams}/>
</Provider>
).toJSON()
expect(tree).toMatchSnapshot();
})
i have found the same problem in stackoverflow but different error, can some one fix it? thanks a lot

Related

Vuex Mutation: Cannot read properties of undefined (reading 'Id')

I seem to be running into an odd problem. I have a mutation that removes an object from one array in my state, and then disable the same object in a different array. It works fine most of the time, I add them and remove them with my buttons. But after I've done it 4 - 5 times (a random amount of times it seems), the next time I click it I get the error:
500
Cannot read properties of undefined (reading 'Id')
Console:
TypeError: Cannot read properties of undefined (reading 'Id')
at eval (mutations.js?014a:69:1)
at Array.find (<anonymous>)
at Store.BOOKING_REMOVE_SESSION (mutations.js?014a:68:1)
at wrappedMutationHandler (vuex.esm.js?2f62:844:1)
at commitIterator (vuex.esm.js?2f62:466:1)
at Array.forEach (<anonymous>)
at eval (vuex.esm.js?2f62:465:1)
at Store._withCommit (vuex.esm.js?2f62:624:1)
at Store.commit (vuex.esm.js?2f62:464:1)
at Store.boundCommit [as commit] (vuex.esm.js?2f62:409:1)
My mutation:
BOOKING_REMOVE_SESSION: (state, sessionData) => {
state.performBooking.sessions.find((o,i) => {
if(o.Id === sessionData.Id){
state.performBooking.sessions.splice(i, 1)
}
})
let sessionIndex = state.currentShow.sessions.findIndex(x => x.Id === sessionData.Id)
state.currentShow.sessions[sessionIndex].activated = false;
}
It seems to do exactly what I want except when it errors. I think it has something to do with when there are a few things in the state.performBooking array. I reckon the problem is with o.Id === sessionData.Id not being able to find a matching ID for some reason.
It's used in conjunction with a button that calls a method:
removeSession(sessionData) {
this.$store.commit('BOOKING_REMOVE_SESSION', sessionData)
}
A sample piece of data would be:
{
attributes: [Object],
Id: 'a1g960010000sJSAAY',
Capacity__c: 5,
Performance__c: 'a1f960001000HMZAA2',
Name: 'Test Performance #041',
Time__c: '2021-11-19T15:00:00.000+0000',
Version__c: 'General'
},
Any help would be greatly appreciated cheers.
I answered it myself by making it less verbose.
Since I'm just looking for the Id I did it in a variable.
OLD:
state.performBooking.sessions.find((o,i) => {
if(o.Id === sessionData.Id){
state.performBooking.sessions.splice(i, 1)
}
})
NEW:
let localSessionIndex = state.performBooking.sessions.findIndex(o => o.Id === sessionData.Id)
state.performBooking.sessions.splice(localSessionIndex, 1)

Native stack is only available if React Native Screens is enabled

When I try to run tests for storyshots with native screens enabled for react-navigation I get this:
Native stack is only available if React Native Screens is enabled.
15 | const getRenderedTree = (story: any) => {
16 | const storyElement = story.render()
> 17 | const tree = renderer.create(storyElement)
| ^
18 |
19 | return tree
20 | }

reading ID3 tag in NativeScript + Vue

I am trying to read id3 tags of mp3 files in my project but it seems all the node plugins has a dependency on fs ,
since I get this error: TypeError: fs.exists is not a function
so How can I read id3 tags in NativeScript?
{N} !== Node, You will have to fetch the meta data in native iOS / Android way. Use nativescript-media-metadata-retriever plugin.
tns plugin add nativescript-media-metadata-retriever
You could try nativescript-nodeify, but I remember having problem afterwards with with bundling.
Also, I used this back in NativeScript 4. I don't know if this still works in NS 6.
I share my usage of this module in sake of noobies like me, who can waste their times just for a misunderstanding :))
requires:
import { MediaMetadataRetriever } from "nativescript-media-metadata-retriever";
const imageSourceModule = require( "tns-core-modules/image-source" );
const fs = require("tns-core-modules/file-system");
and the code:
// ------- init MediaMetadataRetriever
let mmr = new MediaMetadataRetriever();
mmr.setDataSource( newValue );
mmr.getEmbeddedPicture()
.then( ( args ) => {
// ------- show the albumArt on bgIMG
var albumArt = this.$refs.bgIMG.nativeView;
var img = new imageSourceModule.ImageSource();
// ------- setNativeSource is a **Methods** of imageSourceModule
img.setNativeSource( args );
albumArt.set( "src" , img );
console.log("ImageSource set...");
// ------- save the albumArt in root of SDCARD
// ------- fromNativeSource is a **Function** of imageSourceModule
let imageSource = imageSourceModule.fromNativeSource( args );
console.log("Here");
let fileName = "test.png";
const root = android.os.Environment.getExternalStorageDirectory().getAbsolutePath().toString();
let path = fs.path.join( root , fileName);
let saved = imageSource.saveToFile(path, "png");
if (saved) {
console.log("Image saved successfully!");
}
} );

'TypeError: currentSubs[i] is not a function' when using ports in Elm 0.19

I am attempting to send data from Elm 0.19 to JavaScript using ports.
Edit: The problem seems to be related to running/building with elm-app
In Elm, I declare an outgoing port:
port modelToJs : Json.Encode.Value -> Cmd msg
which I use in the update function to produce a Cmd that sends a JSON encoded value to JavaScript.
In JS, I instantiate the Elm app:
const app = Elm.Main.init({
node: document.getElementById('root')
});
and register the data handler:
app.ports.modelToJs.subscribe(function dataHandler(data) {
console.log("got from Elm:" + data);
});
When modelToJs is called, the data is not sent and printed to the console. Instead, I get the following JavasScript runtime error (which Elm claims to avoid by design):
TypeError: currentSubs[i] is not a function
var value = _Json_unwrap(converter(cmdList.a));
2160 | for (var i = 0; i < currentSubs.length; i++)
2161 | {
> 2162 | currentSubs[i](value);
2163 | }
2164 | }
2165 | return init;
I have also provided a full proof of concept project on GitHub: https://github.com/mpgirro/elm0.19-ports-issue
The repo also contains an image of the error message (sry, I lack the reputation to post images)
The error appears to be in dataHandler.js. It currently contains this:
function dataHandler(data) {
console.log("got from Elm:" + data);
}
If you declare the function as export default the problem goes away:
export default function dataHandler(data) {
console.log("got from Elm:" + data);
}

Sinon test error with whois-json

I have a service API which up until recently used the whois library to get data.
I use sinon to test the API:
const mockWhoisLookup = sinon.mock(whois);
mockWhoisLookup
.expects('lookup')
.once()
.withArgs('deals.dk')
.callsFake((domain, callback) => {
callback(undefined, whoisSampleResponse);
});
I've decided to use whois-json instead as it provides a 'cleaner' output.
The issue is that when I now run the test it gives me an error output:
TypeError: Attempted to wrap undefined property lookup as function
61 | const mockWhoisLookup = sinon.mock(whois);
62 | mockWhoisLookup
> 63 | .expects('lookup')
64 | .once()
65 | .withArgs('deals.dk')
66 | .callsFake((domain, callback) => {
How do I solve this issue?