Building electron app with svelte frontend.
I have installed extension svelte devtools with
const {default: installExtension} = require('electron-devtools-installer');
const installExtensions = () => {
installExtension('ckolcbmkjpjmangdbmnkpjigpkddpogn') // ID OF SVELTE DEVTOOLS EXTENSION
.then((name) => console.log(`Added Extension: ${name}`))
.catch((error) => console.log('An error occured ', error));
}
Whenever I open devtools and switch to svelte tab I got:
To connect to Svelte perform a hard refresh (ctrl+F5) or click here.
Not working? Did you...
Use Svelte version 3.12.0 or above?
Build with dev mode enabled?
Any help?
Related
I am trying to make a post request in React to the server
my React app is running at port 3000 & express app is running at port 9000
React:
axios.post("/").then((response)=>{
console.log(response.data)
}).catch((e)=>{
console.log(e.response.data)
this.out = e.response.data
})
Express:
app.post("/", (req, res) => {
console.clear()
console.log(req.body)
res.end("req")
})
on the web console it says :
"Failed to load resource: the server responded with a status of 404 (Not Found)"
on the app 'postman' It runs just fine
I tried to follow this YT tutorial https://www.youtube.com/watch?v=kJA9rDX7azM
First you need to check weather you add a proxy in your React APP project Package.Json file under the private dependency name,
proxy:
'http://localhost:9000/'
Axios first look for the port you are requesting for in the current server which is in you case is / so / is also a port in frontend so it never goes for the backend be safe to go with
axios.post("http://localhost:9000/")
.then((response)=>{
console.log(response.data)
})
.catch((e)=>{
console.log(e.response.data)
})
Secondly make sure you must install the axios dependency in your react project
Seems like you forgot to add domain in the axios request.
axios.post("http://localhost:9000/").then((response)=>{
console.log(response.data)
}).catch((e)=>{
console.log(e.response.data)
this.out = e.response.data
})
I have an express app with a CRUD API (with sequelize) and I want to test it with Jest. I'm pretty new in unit-testing so I follow this guide, recommended by Jest's website.
The problem I have is that my app is built with ES6 modules and Jest ES6 modules is experimental and it seems that it doesn't "import" packages.
I have this test (took from the guide)
import request from 'supertest';
import app from '../app';
describe('Test the root path', () => {
test('It should response the GET method', done => {
request(app)
.get('/')
.then(response => {
expect(response.statusCode).toBe(404);
done();
});
});
});
And when I launched it (with NODE_OPTIONS=--experimental-vm-modules npx jest I had to follow this jest wiki page), It says that
'sequelize' does not provide an export named 'DataTypes' and when I launch my app normally (like with npm start) it works fine, without any problems.
(the complete error log):
(node:49576) ExperimentalWarning: VM Modules is an experimental feature. This feature could change at any time
(Use `node --trace-warnings ...` to show where the warning was created)
FAIL __tests__/app_test.js
● Test suite failed to run
SyntaxError: The requested module 'sequelize' does not provide an export named 'DataTypes'
at Runtime.linkAndEvaluateModule (node_modules/jest-runtime/build/index.js:779:5)
at TestScheduler.scheduleTests (node_modules/#jest/core/build/TestScheduler.js:333:13)
at runJest (node_modules/#jest/core/build/runJest.js:404:19)
at _run10000 (node_modules/#jest/core/build/cli/index.js:320:7)
at runCLI (node_modules/#jest/core/build/cli/index.js:173:3)
(and my Jest config)
// Sync object
/** #type {import('#jest/types').Config.InitialOptions} */
export default async () => {
return {
verbose: true,
transform: {},
};
};
Am I doing something wrong ? Should I change to commonJS instead of ES6
Thank you.
This is a known problem in Jest: #9771. It is said to be fixed in jest#28.0.0-alpha.0.
An interesting hack to work around this problem is to remove the main field from the package.json of the imported project.
I have added the required build packs. There are also no errors shown in heroku logs. Locally the deployed application works completely fine and scrapes the required news but on heroku the page just refreshes and displays nothing
app.post("/news",function(req,res){
var pla= req.body.place;
var url='https://www.google.com/search?q=covid+19+'+pla+'&sxsrf=ALeKk02SupK-SO625SAtNAmqA5CHUj5xjg:1586447007701&source=lnms&tbm=nws&sa=X&ved=2ahUKEwikieXS19voAhXAxzgGHV5bCcQQ_AUoAXoECBwQAw&biw=1536&bih=535';
(async () => {
const browser = await puppeteer.launch({args: ['--no-sandbox']});
const page = await browser.newPage();
await page.goto(url);
var data = await page.evaluate(() =>
Array.from(document.querySelectorAll('div.g'))
.map(compact => ({
headline: compact.querySelector('h3').innerText.trim(),
img: compact.querySelector("img") === null ? 'https://upload.wikimedia.org/wikipedia/commons/thumb/6/6c/No_image_3x4.svg/1280px-No_image_3x4.svg.png' : compact.querySelector("img.th.BbeB2d").src,
url: compact.querySelector("h3.r.dO0Ag>a").href,
source: compact.querySelector("div.gG0TJc>div.dhIWPd>span.xQ82C.e8fRJf").innerText.trim(),
time: compact.querySelector("div.gG0TJc>div.dhIWPd>span.f.nsa.fwzPFf").innerText.trim(),
desc : compact.querySelector("div.st").innerText.trim()
}))
)
console.log(data);
res.render('news.ejs',{data: data});
await browser.close();
})();
});
I'd suggest you to add the '--disable-setuid-sandbox' flag to your puppeteer launch command:
const browser = await puppeteer.launch({args: ['--no-sandbox', '--disable-setuid-sandbox']});
I had some problem in the past, and if I recall it correctly the flag helped.
May be this could help (copied from Puppeteer official website) because I had similar problem and it worked for me.
Running Puppeteer on Heroku (https://github.com/puppeteer/puppeteer/blob/main/docs/troubleshooting.md#running-puppeteer-on-heroku)
Running Puppeteer on Heroku requires some additional dependencies that aren't included on the Linux box that Heroku spins up for you. To add the dependencies on deploy, add the Puppeteer Heroku buildpack to the list of buildpacks for your app under Settings > Buildpacks.
The url for the buildpack is https://github.com/jontewks/puppeteer-heroku-buildpack
Ensure that you're using '--no-sandbox' mode when launching Puppeteer. This can be done by passing it as an argument to your .launch() call: puppeteer.launch({ args: ['--no-sandbox'] });.
When you click add buildpack, simply paste that url into the input, and click save. On the next deploy, your app will also install the dependencies that Puppeteer needs to run.
If you need to render Chinese, Japanese, or Korean characters you may need to use a buildpack with additional font files like https://github.com/CoffeeAndCode/puppeteer-heroku-buildpack
There's also another simple guide from #timleland that includes a sample project: https://timleland.com/headless-chrome-on-heroku/.
When I try using workers (aka multithreading) in my Angular - NativeScript app the compiled worker file is not found during app execution. I've found a similar issue on GitHub, but the instructions there did not help me.
Running the app results in the following output:
Project successfully built.
Installing on device 4865d3ab...
Successfully installed on device with identifier '4865d3ab'.
Refreshing application on device 4865d3ab...
Successfully synced application org.nativescript.app on device 4865d3ab.
JS: Angular is running in the development mode. Call enableProdMode() to enable the production mode.
JS: Warning: Setting the 'itemWidth' property of 'ListViewGridLayout' is not supported by the Android platform.
JS: Warning: Setting the 'itemHeight' property of 'ListViewGridLayout' is not supported by the Android platform.
JS: Warning: Setting the 'itemHeight' property of 'ListViewGridLayout' is not supported by the Android platform.
JS: Scan!
JS: Subnet: 192.168.2
JS: Permission is not granted (Error: com.tns.NativeScriptException: Failed to find module: "307b720bbe3cb7a8458a.worker.js", relative to: app/tns_modules/
JS: com.tns.Module.resolvePathHelper(Module.java:146)
JS: com.tns.Module.resolvePath(Module.java:55)
JS: com.tns.Runtime.callJSMethodNative(Native Method)
JS: com.tns.Runtime.dispatchCallJSMethodNative(Runtime.java:1160)
JS: com.tns.Runtime.callJSMethodImpl(Runtime.java:1040)
JS: com.tns.Runtime.callJSMethod(Runtime.java:1027)
JS: com.tns.Runtime.callJSMethod(Runtime.java:1007)
JS: com.tns.Runtime.callJSMethod(Runtime.java:999)
JS: com.tns.NativeScriptActivity.onRequestPermissionsResult(NativeScriptActivity.java:58)
JS: android.app.Activity.dispatchRequestPermissionsResult(Activity.java:7630)
JS: android.app.Activity.dispatchActivityResult(Activity.java:7480)
JS: android.app.ActivityThread.deliverResults(ActivityThread.java:4489)
JS: android.app.ActivityThread.handleSendResult(ActivityThread.java:4538)
JS: android.app.servertransaction.ActivityResultItem.execu...
How can I solve this problem?
Many thanks for your help.
EDIT
I am importing the worker with:
import TestWorker from 'worker-loader!./workers/test.worker.js'
The worker itself has the file name test.worker.ts and the following content:
const context: Worker = self as any;
context.onmessage = msg => {
setTimeout(() => {
console.log('Inside TS worker...');
console.log(msg);
(<any>global).postMessage('TS Worker');
}, 500);
};
What am I doing wrong here? Many thanks for the help. Very nice of you.
If you are using the nativescript-worker-loader plugin as Manoj suggested, you will need to import the worker with
import TestWorker from 'nativescript-worker-loader!./workers/test.worker.js'
not with
import TestWorker from 'worker-loader!./workers/test.worker.js'
You can also use
import TestWorker from 'nativescript-worker-loader!./workers/test.worker'
that should not make any difference.
Also make sure that you declare the module of the typings/custom.d.ts file as described in the nativescript-worker-loader readme as nativescript-worker-loader!*
Summary:
I'm trying use Chrome's "Take Heap Snapshot" to track down a memory leak in some node.js code, but the act of taking a snapshot never completes.
Am I mis-using the tool somehow?
Details:
Here's the node.js app:
#!/usr/bin/env node
var serialserver = require('./p5.serialserver');
serialserver.start();
console.log("p5.serialserver is running");
Here's how I invoke it, and what it prints out:
$ node --inspect ./p5serial
Debugger listening on port 9229.
Warning: This is an experimental feature and could change at any time.
To start debugging, open the following URL in Chrome:
chrome-devtools://devtools/remote/serve_file/#521e5b7e2b7cc66b4006a8a54cb9c4e57494a5ef/inspector.html?experiments=true&v8only=true&ws=localhost:9229/node
p5.serialserver is running
In Chrome (Version 59.0.3071.115), running under OSX 10.12.6 (Sierra), I open the given URL and click on Take Heap Snapshot. I see the icon in the left column which says:
Snapshot 1
Snapshotting...
... but even after waiting for ten minutes, the snapshot hasn't completed. This is not a particularly large node application.
What am I missing?
I was able to successfully take a heap snapshot of the following:
const http = require('http');
const port = 3000;
const requestHandler = (request, response) => {
console.log(request.url);
response.end(`you requested ${request.url}`);
};
const server = http.createServer(requestHandler);
server.listen(port, (err) => {
if (err) {
return console.log('something bad happened', err);
}
console.log(`server is listening on ${port}`);
});
Invoked via node --inspect server.js
Version info:
macOS Sierra 10.12.6
Chrome 62.0.3174.0 (Official Build) canary (64-bit)
Try downloading Chrome Canary and see if the problem is resolved in the latest version of Chrome.
If not, then there may be something going on with this serial server. Did you build it, or is it a library?