Hi as per docs getServerSideProps is a function which is executed only on server side.
export async function getServerSideProps(context) {
console.log("hello world");
debugger;
return {
props: {
age:55
}, // will be passed to the page component as props
}
}
As a consequence simply dropping a debugger keyword won't work.
I have tried:
Attaching the node.js debugger on port 9229
Running node --inspect-brk ./node_modules/next/dist/bin/next
Running cross-env NODE_OPTIONS='--inspect' next dev
But neither console.log() nor debugger keyword seem to have any effect.
However my props from getServerSideProps are passed in correctly, which proves the function is called.
Is it possible to stepthrough getServerSideProps or at least get console.log working? Thanks!
P.S.
The lines of code outside getServerSideProps are debuggable and work as expected.
In order to make the open the debug port open properly, you need to do the following:
// package.json scripts
"dev": "NODE_OPTIONS='--inspect' next dev"
// if you want custom debug port on a custom server
"dev": "NODE_OPTIONS='--inspect=5009' node server.js",
Once the debug port is own, you should be able to use inspector clients of your choice.
I had the same problem and I solved it with following steps. First, I installed cross-envpackage with
npm install cross-env
then I had to adjust my package.json with
"dev": "cross-env NODE_OPTIONS='--inspect' next dev",
After that you should be able to run npm run dev.
Open localhost:3000 or whatever port u are normally running nextjs app on. Open new tab and type
chrome://inspect
You should be able to see path to your app with word inspect at the end. After clicking new devTools will be opened with ability to set up breakpoints inside e.g. getStaticPaths, getStaticProps or getServerSideProps.
Related
Background
I use dynamic import for Firebase Functions to reduce cold start time based on this post: https://medium.com/firebase-developers/organize-cloud-functions-for-max-cold-start-performance-and-readability-with-typescript-and-9261ee8450f0
index.ts under functions folder has only one line
exports.consent = require("./myFunctionGroup");
index.ts under functions/myFunctionGroup
import * as functions from "firebase-functions";
export const helloWorld = functions.https.onCall(async (data, context) => {
return await (await import("./helloWorld")).default(data, context);
});
Content of helloWorld.ts under functions/myFunctionGroup
import * as functions from "firebase-functions";
export default async (
data: {},
context: functions.https.CallableContext
) => {
return "hello";
}
There is no problem when the emulator first launched as it return "hello" correctly. However, when I change to return to 'return "world";', even though the emulator seems to be aware of the change and prints ✔ functions: Loaded functions definitions from source:..., it still return the old value of hello. Maybe it has some kind of cache for the original imported module. When I restart process again, then it will then print "world".
Question:
Is there any setting to make the emulator aware my change and force to clear the Functions cache? I tried to use debugger and it realized my code has changed so that I can step through the new code. It's just not working for the Firebase emulator.
It was expected behavior,any changes/modification in the code after running the emulator will not be reflected. You can also refer to this documentation:
Note:Code changes you make during an active session are automatically
reloaded by the emulator. If your code needs to be transpiled
(TypeScript, React) make sure to do so before running the emulator.
You can run your transpiler in watch mode with commands like tsc -w to
transpile and reload code automatically as you save.
You can follow the below steps,As mentioned in this stackoverflow thread
After every change to the ts files, run "npm run build" to compile the code again.
Change "build": "tsc" to "build": "tsc -w" in package.json if you want to auto-compile after every change.
There is a bug raised for this at github which is still open you can track the updates there.
I want to disable Next.js telemetry in all environments, forever (Just because, Ok? Let's not sidetrack the question with irrelevant debate).
I don't want the telemetry to run on developer environments, test builds, CI builds or anywhere else.
I'm trying to find a "code" solution - I don't want to have to do anything manually in an environment in order to switch off telemetry.
Next.js makes it difficult to figure out if telemetry is enabled because it only prints the telemetry warning once on a given machine.
My diagnostic for knowing if telemetry is running is to add the next telemetry status command to my build script in package.json:
"build": "next telemetry status && next build",
I've tried adding the following to next.config.js:
module.exports = {
env: {
NEXT_TELEMETRY_DISABLED: '1',
},
}
And I've tried adding this to .env:
NEXT_TELEMETRY_DISABLED=1
But the telemetry command still reports Status: Enabled
In fact, the NEXT_TELEMETRY_DISABLED env variable doesn't seem to work at all, I tried manually disabling telemetry in my IDE by setting the env variable, but it still reports telemetry is enabled:
Next.js version: 9.5.2
Doco: https://nextjs.org/telemetry
Github issue: https://github.com/vercel/next.js/issues/8851
Adding next telemetry disable command as my prebuild script seems to have done the trick.
"prebuild": "next telemetry disable",
"build": "next build",
I have been experimenting with javascript frameworks for test automation and one of them is testCafe. I have been able to set up a simple TestCafe project and run some test cases for my application. However, now, the requirement is to have some kinda BDD support built in it. I looked up a few testCafe-cucumber integration projects on GitHub but I can't get them to run. here are a few that I tried:-
1) https://github.com/rquellh/testcafe-cucumber
- I cloned the repo,
- did npm install,
- run the test cases using "npm test",
- blank browser launches but test doesn't run. I see this error in VS code console:
× Before # features\support\hooks.js:46
Error: function timed out, ensure the promise resolves within 20000 milliseconds
at Timeout._onTimeout (C:\Users\Mo\Desktop\TestCafe\github\testCafeBDD\testcafe-cucumber\node_modules\cucumber\src\user_code_runner.js:61:18)
at ontimeout (timers.js:482:11)
at tryOnTimeout (timers.js:317:5)
at Timer.listOnTimeout (timers.js:277:5)
× After # features\support\hooks.js:60
ReferenceError: testController is not defined
Then I tried another gitHub project namely this one : https://github.com/kiwigrid/gherkin-testcafe
the run command in readme doesn't work for me, it doesn't even recognize the "gherkin-testcafe".
When I run my TestCafe test cases without the cucumber I have this line in my package.json
"scripts": {
"test": "testcafe chrome Tests/ -e --proxy https.proxy.mycompany.com:8000"
},
the proxy is mentioned because I am behind a proxy and without this the browser launches but does not run any test cases. I found this fix on testCafe site
I am guessing(not sure yet) this could be the issue with cucumber integration as well. None of these frameworks work as they don't set up the proxy anywhere. Can someone point me in the right direction? if the proxy needs to be set up then where in the framework does it need to go- an example would be helpful?
TestCafe/Cucumber integrations rely on starting TestCafe runner programmatically.
In the repo, search for this sequence:
const runner = tc.createRunner();
return runner
.src('./test.js')
.screenshots('reports/screenshots/', true)
.browsers(browser)
.run()
.catch(function(error) {
console.error(error);
});
or search for this sequence:
await runner
.browsers(browsers)
.specs(specs)
.steps(steps)
.concurrency(concurrency)
.startApp(app, appInitDelay)
.tags(tags)
.run(...)
Chain the useProxy method on runner object (do it before the run()method):
const runner = tc.createRunner();
return runner
.src('./test.js')
.screenshots('reports/screenshots/', true)
.browsers(browser)
.useProxy('username:password#proxy.mycorp.com')
.run()
.catch(function(error) {
console.error(error);
});
I have a Meteor app and want to call a server method from the command line, so that I can write a bash script to perform scheduled operations.
Is there any way to either call a method directly, or submit a form which will then trigger server-side code?
I've tried using curl to call a method, but either it's not possible or I'm missing something basic. This doesn't work:
curl "http://localhost:3000/Meteor.call('myMethod')"
nor does:
curl -s -d "http://localhost:3000/imports/api/test.js" > out.html
where test.js:
var test = function(){
console.log('hello');
}
I thought of using a form but I can't think how to create a submit event because the Meteor client uses template events that then call server methods.
I'll be very grateful for any help! This feels like it should be a simple thing but has me stumped.
Edit: I've also tried phantomjs and slimerjs as run through casperjs.
phantomjs is no longer maintained and generates an error:
TypeError: Attempting to change the setter of an unconfigurable property.
https://github.com/casperjs/casperjs/issues/1935
slimerjs errors with Firefox 60 and I can't figure out how to 'downgrade' back to the supported 59, and the option to disable automatic updates of Firefox no longer seems to exist. The error is:
c is undefined
https://github.com/laurentj/slimerjs/issues/694
You could make use of the node ddp package to call the Meteor method in an own js file that you created with a specific script. From there you can pipe all outs to wherever you want.
Let's assume the following Meteor method:
Meteor.methods({
'myMethod'() {
console.log("hello console")
return "hello result"
}
})
The upcoming steps will let you call this method from another shell, assuming your Meteor application is running.
1. Install ddp in your global npm directory
$ meteor npm install -g ddp
2. Create the script to call your method in your test directory
$ mkdir -p ddptest
$ cd ddptest
$ touch ddptest.js
Place the ddp script code into the file with the editor or command of your choice.
(The follwing code is freely taken from the package's readme. Feel free to configure to your needs.)
ddptest/ddptest.js
var DDPClient = require(process.env.DDP_PATH);
var ddpclient = new DDPClient({
// All properties optional, defaults shown
host : "localhost",
port : 3000,
ssl : false,
autoReconnect : true,
autoReconnectTimer : 500,
maintainCollections : true,
ddpVersion : '1', // ['1', 'pre2', 'pre1'] available
// uses the SockJs protocol to create the connection
// this still uses websockets, but allows to get the benefits
// from projects like meteorhacks:cluster
// (for load balancing and service discovery)
// do not use `path` option when you are using useSockJs
useSockJs: true,
// Use a full url instead of a set of `host`, `port` and `ssl`
// do not set `useSockJs` option if `url` is used
url: 'wss://example.com/websocket'
});
ddpclient.connect(function(error, wasReconnect) {
// If autoReconnect is true, this callback will be invoked each time
// a server connection is re-established
if (error) {
console.log('DDP connection error!');
console.error(error)
return;
}
if (wasReconnect) {
console.log('Reestablishment of a connection.');
}
console.log('connected!');
setTimeout(function () {
/*
* Call a Meteor Method
*/
ddpclient.call(
'myMethod', // namyMethodme of Meteor Method being called
['foo', 'bar'], // parameters to send to Meteor Method
function (err, result) { // callback which returns the method call results
console.log('called function, result: ' + result);
ddpclient.close();
},
function () { // callback which fires when server has finished
console.log('updated'); // sending any updated documents as a result of
console.log(ddpclient.collections.posts); // calling this method
}
);
}, 3000);
});
The code assumes that your app runs on localhost:3000, note that there is no conncection close on errors or undesired behavior.
As you can see at the top, the file imports your globally installed ddp package. Now in order to get it's path without using additional tools, just pass an environment variable (process.env.DDP_PATH) and let your shell handle the path resolving.
In order to get the installation path you can use npm root with the global flag.
Finally call your script via:
$ DDP_PATH=$(meteor npm root -g)/ddp meteor node ddptest.js
Which will give you the following output:
connected!
updated
undefined
called function, result: hello result
And logs hello console to the open session that is running your meteor app.
Edit: A note on using this in production
If you want to use this script in production you have to use the shell commands without the meteor command but using your installation of node and npm.
If you get in trouble with paths use process.execPath to find your node binary and npm root -g to find your global npm modules.
You can check out this documentation: Command Line | meteor shell.
While your meteor app is running, you can execute meteor shell to start an interactive console. In the console, you can do Meteor.call(...).
So if you want to write a script with using meteor shell, you might need to pipe the script file for meteor shell. Like,
$ meteor shell < script_file
See also the answer of "How can I pipe a command into the meteor shell?"
I've got GraphIQL running fine on my desktop Mac at http://localhost:8080/graphql.
And on my laptop Mac, using the exact same code synced via Github, I show this in the console:
GraphQL Server is now running on http://localhost:8080/graphql
...which appears to indicate that graphql is connected. But accessing
http://localhost:8080/graphql brings up a 404 error:
Not Found
The requested URL /graphql was not found on this server
I even deleted my node_modules folder and reinstalled from scratch via meteor npm install.
Does this make sense to anybody?
Here's the code that sets up Apollo and graphiql:
//apollo
import express from 'express';
import { apolloServer } from 'apollo-server';
import Schema from '/imports/api/schema';
import Mocks from '/imports/api/mocks';
import Resolvers from '/imports/api/resolvers';
import Connectors from '/imports/api/db-connectors';
const GRAPHQL_PORT = 8080;
const graphQLServer = express();
graphQLServer.use('/graphql', apolloServer({
graphiql: true,
schema: Schema,
resolvers: Resolvers,
connectors: Connectors,
mocks: Mocks,
}));
graphQLServer.listen(GRAPHQL_PORT, () => console.log(
`GraphQL Server is now running on http://localhost:${GRAPHQL_PORT}/graphql`
));
So, this could be because you have something else running on 8080 on your laptop. Maybe try logging uncaught express errors to the console?
Another possibility is that you're not trying exactly the same URL on your desktop. Version 0.2 of apolloServer currently allows only POST requests. When you navigate to the address in your browser, it will try to send a GET request, which will result in a 404. Try spinning up graphiql on a separate route and see if you can access that.
PS: If you get a chance, you should make a PR to the repo where you copy-pasted the code snippet from, so other people won't run into the same issue ;-)
I used npm remove apollo-server and npm install apollo-server --save to update the apollo-server npm module, and did the same for apollo-client. I then updated to the apollo server 0.2.x code found at http://docs.apollostack.com/apollo-server/migration.html. I also updated to Meteor 1.4.x. Now the 404 error is gone.