We Keep Coding

Failed to resolve module specifier

I`m only starting my JS journey and I will be really grateful if you help me to receive data using the JS. I found that info on the alcor exchange site that is the exchange site for wax (gaming crypto currency).
What is on site:
// Code not tested yet, and provided for explanation reason
import fetch from 'node-fetch'
import { Api, JsonRpc, RpcError } from 'eosjs'
const rpc = new JsonRpc('https://wax.greymass.com', { fetch })
// Get buy orderbook from table
const { rows } = await rpc.get_table_rows({
code: 'alcordexmain',
table: 'buyorder',
limit: 1000,
scope: 29, // Market id from /api/markets
key_type: 'i128', // we are using it for getting order sorted by price.
index_position: 2
})
I faced with some trouble because of JSHint version and updated it to 9. But still "await" is red and JSHint is asking for semicolon after it - which causes huge amount of new errors. However the project is opening in the browser with no info of course. But in the console I see an error.
index.html:1 Uncaught TypeError: Failed to resolve module specifier "node-fetch". Relative references must start with either "/", "./", or "../".
P.S. I checked the posts with such error but actually didn't understand what should I do because all of them are proposing some changes for JSON file and I only have index.html and that js. file.

There is a difference between JavaScript in your browser and JavaScript on a server.
JavaScript in a browser is the code that can be injected into HTML (inlined or linked), which is evaluated by the browser.
JavaScript on a server is not related to JavaScript in a browser. The language is the same, but the environment is not. It's like “draw in Paint” and “draw on a real life canvas”. Colors are the same, but everything else is not.
So, what you are trying to do here is to run server-side JavaScript in a browser. That's the real reason you're getting this error.
There are two ways to fix this error.
Probably the one you should go
You should install Node.js, read about npm, init your npm project, put everything into .js file and eval using Node.
In a nutshell, let's say you've already installed Node.js and node -v outputs something in your terminal. Then everything you need to do is:
$ cd path/to/the/directory/you/like
$ npm init -f
$ npm install --save node-fetch eosjs
$ touch index.js
Then edit index.js using your favorite editor, adding there the code you're trying to run.
You may encounter error due to using await on a “top-level”. In this case, put it into an async function:
import fetch from 'node-fetch'
import { Api, JsonRpc, RpcError } from 'eosjs'
const rpc = new JsonRpc('https://wax.greymass.com', { fetch })
(async () => {
const { rows } = await rpc.get_table_rows({
code: 'alcordexmain',
table: 'buyorder',
limit: 1000,
scope: 29, // Market id from /api/markets
key_type: 'i128', // we are using it for getting order sorted by price.
index_position: 2
});
})();
Aaaand, that's it. You do not need to run browser here at all.
Probably the one you should not go, but can
If you need to run your JavaScript in a browser, then you need to either bundle all the deps using a tool like webpack (which still requires you to use Node.js & npm), or you may replace the deps you're trying to use with client-side alternatives.
E.g. instead of requiring node-fetch you may use Fetch API.
What to use instead of eosjs I do not know, but if you decide to use this dependency in a browser, you will at least need to use import maps to tell the browser how to resolve such dependencies. Because, well, the error you've got tells you exactly this: your browser does not know what you're trying to import. Browsers use URLs as import paths, not ids (or “bare names”).

What does "jest.mock" function calls under the hood?

I've been creating an application using NodeJS ESModules (a.k.a import instead of require()) and the problem comes when I trying to test it - I am stuck on this for about a month now because I cannot find a good package to solve this "simple" issue.
Since I am using ESM, I cannot use libs such as rewire because, as it says on the docs, they don't support it. So I need a way to mock some dependencies during tests using the import syntax, and the only (trustable) package I've found that does the job is Jest.
I think that installing the whole Jest package to only use it's mock functionality would be overkill, so I've been trying to research packages on the internet to make it work. I came across a bunch of them (proxyquire, testouble, etc) and NONE of them worked. So by digging up Jest's repo I've found this jest-mock that is used under the hood, but I don't know how to use to mock those dependencies.
That leads to the question: which method/function does Jest calls when using jest.mock ?
I will give an example of what I want to test so, maybe, you guys can help me out (I am in a point that I can try anything, I just need to proceed with the application):
someFile.js
export const generateSomething = () => Date.now();
Creator.js
import { generateSomething } from './someFile.js';
export default () => {
const create = () => {
return { a: 1, b: generateSomething() };
}
}
So, I want to perform some unit tests on this Creator.js, then I need to mock this generateSomething function to return 0 (for example). How can I do it using this jest-mock (or any other package)? Does jest.mock call this package at all?
P.S: I don't want to use jest as testing lib, I am currently using #hapi/code with #hapi/lab

firebase.initializeApp() vs FirebaseApp.initializeApp()

I currently trying to set up push notifications using the Notifications package from 'expo-notifications', Im just getting the following error and I cant work around it:
[Error: Encountered an exception while calling native method: Exception occurred while executing exported method getDevicePushTokenAsync on module ExpoPushTokenManager: Default FirebaseApp is not initialized in this process com.-----.-----. Make sure to call FirebaseApp.initializeApp(Context) first.]
The thing is, this message is completely enraging me because I do call:
import * as firebase from "firebase";
and after that:
firebase.initializeApp(ApiKeys);
at the start of my app.
Do I now need to install the Firebase/App package so I can do FirebaseApp.initializeApp()? Do I need to initialize my app 2 times then?
Neither the docs from expo are mentioning such an error, nor I found anything related to this error in the firebase docs and Im really struggling with this one.

Aperently there is an import into the app/build.gradle file which is not mentioned inside the expo docs at all. Its the following line which is missing:
implementation("com.google.firebase:firebase-iid")
you need to put it inside your app/build.gradle file to make it work.
I found it in the following forum, the posts are just one month old so its a quite new bug.

React Native PagerView Webpack TypeError on web

I'm using the PagerView component from 'react-native-pager-view' at https://github.com/callstack/react-native-pager-view.
Short backstory my app is intended to be available on all 3 platforms (Android, iOS, web). I know that this library doesn't support web, I'm trying to compromise by not using this component on web by trying to conditionally use this component if not on web.
I tried to create an if conditional block that is always false to test it out and it seems that it still tries to read the component on compilation.
import PagerView from 'react-native-pager-view';
const render = () => {
let view = <View></View>;
if (false) { // Ideally (Platform.OS !== "web")
// Code works if I comment out the code line below
view = <PagerView ...></PagerView>;
}
return <View>{view}</View>;
}
Here is the following error message on web if I try to run the code like above.
TypeError:
Object(react_native_web_dist_index__WEBPACK_IMPORTED_MODULE_0__["requireNativeComponent"])
is not a function. (In
'Object(react_native_web_dist_index__WEBPACK_IMPORTED_MODULE_0__["requireNativeComponent"])(VIEW_MANAGER_NAME)',
'Object(react_native_web_dist_index__WEBPACK_IMPORTED_MODULE_0__["requireNativeComponent"])'
is an instance of Object)
I think this could be solved with some kind of Webpack configuration but unfortunately I'm not too savvy on that.
These are also some additional error messages I got on the Expo Metro Bundler page
node_modules/react-native-pager-view/lib/module/PagerView.js Attempted
import error: 'react-native-web/dist/index' does not contain a default
export (imported as 'ReactNative').
node_modules/react-native-pager-view/lib/module/PagerViewNative.js
Attempted import error: 'requireNativeComponent' is not exported from
'react-native-web/dist/index'.
Any help or suggestions would be much appreciated, thanks!

Create-React-App with Moment JS: Cannot find module "./locale"

Just ran an npm update on my web application and now Moment JS appears to be failing with the following message:
Error: Cannot find module "./locale"
\node_modules\moment\src\lib\moment\prototype.js:1
> 1 | import { Moment } from './constructor';
Not sure what version of Moment JS I had prior to my update, but my application has been working for months.
I created another react app and ran an npm install moment --save and modified the source to display the time and ended up with the same error described above.
Not sure if there is a fail-proof way to integrate Moment JS using Create-React-App currently short of ejecting to manage the webpack settings myself, but I really don't want to do this. Anyone else seeing these issues or having success? If so, a short write up would go along way to helping out.

Appears this has already been identified as an issue for Moment JS version 2.19. If you have upgraded to 2.19 run npm install moment#2.18.1 to revert back to previous version until it is fixed!
See thread: https://github.com/moment/moment/issues/4216

Application built with Create React App and using Moment 2.24.0, the following seems to be working fine:
import moment from 'moment';
import 'moment/min/locales';
Instead of importing moment-with-locales directly. Alternatively, also possible to only import required locales:
import moment from 'moment';
import 'moment/locale/fr';
import 'moment/locale/ru';

The answer above, though I have no doubt works for some, does not work for me. The solution I found is fairly quick and easy, but is a little more complicated than simple downgrading.
This problem originates as a result of and can be fixed with webpack. So we're going to have to add a few lines of code to our webpack.config.js file. If you don't have one yet, you can add one to the root webpack directory:
YOURAPPNAME/node-modules/webpack/
So now that you're inside your webpack.config.js file, you need to add a few lines of code. Just copy and paste this inside the new file or adapt it to the code you already have in webpack.config.js.
module.exports = {
resolve: {
alias: {
moment$: 'moment/moment.js'
}
}
};
Your import statement of moment in your index.js (or otherwise named) file should look like this:
import moment from 'moment'
You should now be able to use moment completely normally. For example:
var tomorrow = moment().add(1, "day")

If you have a fresh install, or upgraded moment to 2.25 and are getting this warning now, try forcing all your packages to use 2.24.
UPDATE: New release 2.25.3 has been reported to fix this problem! Try to first just update.
If you depend on some library that didn't upgrade yet, tell them to upgrade. And in the meantime, if you need 2.25, you can force also your sub-dependencies to use this version.
If you're using yarn add these lines into package.json
"resolutions": {
"**/moment": ">=2.25.3"
},
This is to be added inside packages.json at the top level, i.e. with the same indentation as "dependencies".