Develop Reference

gatsby-source-wordpress error: "An empty string was returned instead of a response when making a GraphQL request."

Following the steps at the gatsby wordpress tutorial, I added the necessary plugins to my wordpress and created the gatsby code. Everything is properly fetched, except for posts, I receive the following error:
An empty string was returned instead of a response when making a GraphQL request.
This may indicate that you have a WordPress filter running which is causing WPGraphQL
to return an empty string instead of a response.
Please open an issue with a reproduction at
https://github.com/gatsbyjs/gatsby/issues/new
for more help
Error occurred while updating a single "post" node.
ERROR
TypeError: Cannot read property 'post' of undefined
at fetchAndCreateSingleNode (/Users/bbt/Documents/Work/my-wordpress-gatsby-site-2/node_modules/gatsby-source-wordpress/src/steps/source-nodes/update-nodes/wp-actions/update.js:76:24)
at processTicksAndRejections (internal/process/task_queues.js:95:5)
at wpActionUPDATE (/Users/bbt/Documents/Work/my-wordpress-gatsby-site-2/node_modules/gatsby-source-wordpress/src/steps/source-nodes/update-nodes/wp-actions/update.js:311:20)
at handleWpActions (/Users/bbt/Documents/Work/my-wordpress-gatsby-site-2/node_modules/gatsby-source-wordpress/src/steps/source-nodes/update-nodes/wp-actions/index.js:60:7)
at fetchAndRunWpActions (/Users/bbt/Documents/Work/my-wordpress-gatsby-site-2/node_modules/gatsby-source-wordpress/src/steps/source-nodes/update-nodes/wp-actions/index.js:102:7)
at fetchAndApplyNodeUpdates (/Users/bbt/Documents/Work/my-wordpress-gatsby-site-2/node_modules/gatsby-source-wordpress/src/steps/source-nodes/update-nodes/fetch-node-updates.js:44:36)
at sourceNodes (/Users/bbt/Documents/Work/my-wordpress-gatsby-site-2/node_modules/gatsby-source-wordpress/src/steps/source-nodes/index.ts:60:5)
at runSteps (/Users/bbt/Documents/Work/my-wordpress-gatsby-site-2/node_modules/gatsby-source-wordpress/src/utils/run-steps.ts:41:9)
at runAPI (/Users/bbt/Documents/Work/my-wordpress-gatsby-site-2/node_modules/gatsby/src/utils/api-runner-node.js:462:16)
ERROR #gatsby-source-wordpress_112003
gatsby-source-wordpress
Encountered a critical error when running the sourceNodes.sourceNodes build step.
See above for more information.
Relevant gatsby-config.js:
resolve: `gatsby-source-wordpress`,
options: {
url:
process.env.WPGRAPHQL_URL ||
`https://BLOGURL.com/graphql`,
auth: {
htaccess: {
username: `HTACCESS-USERNAME`,
password: `HTACCESS-PASSWORD`,
},
},
schema: {
perPage: 5, // making it slow (suggested somewhere)
requestConcurrency: 5, // making it slow (suggested somewhere)
previewRequestConcurrency: 2, // making it slow (suggested somewhere)
},
},
I can query the post nodes in the wordpress graphQL without a problem, they are there.
Any ideas how to debug this?

I solved it the following way -- switched off all plugins and it worked. Switched them back one-by-one, and there was a certain plugin (something related to external links, so absolutely not something that was suspicious) that caused the problem. It works since the plugin is switched off.

d3js v6 reading multiple csv with Promise.all returning 404

I am new to working with d3 and loading in data, and I had an error I could not find any solution for.
I am trying to read a few csv files at once, filter them, and allow for them to be used later on with drawing my graphs. Note, the code below is simplified with the datafile names and variable names.
Promise.all([
d3.dsv(";", "data/data1.csv"),
d3.dsv(";", "data/data2.csv"),
d3.dsv(";", "data/data3.csv"),
]).then(function(data) {
var var1 = data[0].filter(d => d => d.Date_statistics.includes("-2-"));
var var2 = data[1].filter(d => d => d.Municipality_name.includes("Amsterdam"));
var var3 = data[2].filter(d => parseInt(d["Total Population"]) > 50000);
console.log("result 1: ", var1)
console.log("result 2: ", var2)
console.log("result 3: ", var3)
}).catch(function(err) {
// handle error here
console.log(err)
});
The problem I am facing, is that when I have added this to my js file, and have that added in my HTML, the console returns to me with a GET error 404, "data/data2.csv" not found(and the same for data3.csv). I'm not sure why I'm getting a 404 error here, because as far as I can tell, I'm loading the data properly as a csv, after which I'm trying to do some filtering to print.
I have tried to make the files that I put in as a variable, and use the path as the value, but that did not work either. Putting all the dsv reading functions with their individual filtering and logging separately, so not in a Promise.all() function, gives me the same result, except for the fact that it now does print the content of the first filtering.
Is there something wrong with how I'm approaching the problem(as in, I should not use Promise.all() here), or am I missing something that results in these 404 errors?

Alright, seems like I've made a mistake after all, my data files had an error in their names when I put them into the d3.dsv(";", "...") part, the names were just not matching up with the names of the actual data files. This can be closed.

$.ajax responseText differs from responseJSON

I am seeing a difference in what is returned when comparing the responseJSON and responseText properties of my ajax request.
In the image below, you see that referencing the responseJSON excludes the "properties" property. When I parse and use the responseText, the "properties" property is included.
I've not encountered this kind of weirdness before, anyone have any suggestions or thoughts as to why this is occurring?
Edit 1: The properties object is undefined when attempting to access it directly from the responseJSON. See below image:
Edit 2: I am unable to replicate this issue in my jsFiddle (http://jsfiddle.net/madChemist/4hd9cz1g/). I am using jQuery version 2.1.4 incase that helps to diagnose things.
The responseJSON is equivalent to the parsed responseText in my fiddle:
Parsed responseText properties - {"border-color":"cyan","border-style":"dashed","border-width":"5px"}
Unoutched responseJSON properties - {"border-color":"cyan","border-style":"dashed","border-width":"5px"}
The two differences I see between my environment and this one are primarily that the ajax request type is a GET not POST. The data in the fiddle was trimmed compared to what I am loading in my environment. I tested both trimmed & untrimmed which produced no difference in my findings.
Edit 3: I've taken some screenshots of my code to demonstrate what I am attempting to do. The screenshots I took originally were logged while I had my breakpoint on the second assertion in the unit test module.

My tests are passing now. My issue may actually be with QUnit's scoping. The odd behavior above went away when I made these changes to my test:
QUnit.test("Method exportLayout", 2, function (assert) {
var done = assert.async();
$('body').append('<div id="application" style="display:none;"></div>');
var controller = new ApplicationController();
controller.createApplicationWorkspace();
var load = controller.loadLocalProject(); // Pulls in local JSON file
load.complete(function (request) {
var loaded = request.responseJSON; //$.parseJSON(request.responseText);
controller.setUpLayout($.parseJSON(request.responseText)); // Creates workspace from saved state
var result = controller.generateLayout(); // Generates Object. Data property should equal what was loaded in originally.
assert.ok(result !== undefined && result.data !== undefined, "Application controller generates layout response in a proper format.");
assert.deepEqual(loaded, result.data, "Freshly generated export is the same as initially loaded in import.");
// Teardown
setTimeout(function () {
controller.layout.destroy();
$('#application').remove();
done();
}, 0);
});
});
Specifically made this change:
controller.setUpLayout($.parseJSON(request.responseText));
The setUpLayout method is a few hundred lines long, but this is how it begins:
setUpLayout: function (loaded) {
if (typeof loaded !== 'object' || !loaded.hasOwnProperty('rows')) {
throw new Error('Invalid format for loaded paramater in setUpLayout method.');
}
var initial_mode = TE.Application.reqres.request('editor:mode');
TE.Application.vent.trigger('editor:toggle_mode', true);
var layout = $.extend({}, loaded);
var rowCollection = this.layout.editor.currentView.rows.currentView;
var rows = layout.rows; // Once stashed in a var,
...
// Doesn't make use of `loaded` parameter. Only modifications are to `layout` variable.
}
I feel like there may still be something else at work here, but I wanted to update this post with what I had just found. Hoping someone else may be able to notice something that I did not.

uncaught TypeError: undefined is not a function when using JSON object with name

I'm using D3js with Mongodb and AnguarlJS to display my data. All is good that it works until when I give my JSON array a name. Then angular starts complaining about stuff and I'm not sure why.
this is the original json array that works with this original code
[
{
"defaultCategory":"Happy",
"timesUsed":2704659
},
{
"defaultCategory":"Sad",
"timesUsed":4499890
},
{
"defaultCategory":"Laughter",
"timesUsed":2159981
},
{
"defaultCategory":"Smirk",
"timesUsed":3853788
},
{
"defaultCategory":"Flirty",
"timesUsed":14106543
}
]
d3.json("data.json", function(error, data) {
data.forEach(function(d) {
d.timesUsed =+ d.timesUsed;
});
but when i change the json to this format, it breaks
{
"mymood":[
{
"defaultCategory":"Happy",
"timesUsed":2704659
},
{
"defaultCategory":"Sad",
"timesUsed":4499890
},
{
"defaultCategory":"Laughter",
"timesUsed":2159981
},
{
"defaultCategory":"Smirk",
"timesUsed":3853788
},
{
"defaultCategory":"Flirty",
"timesUsed":14106543
}
]
}
d3.json("data.json", function(error, data) {
data.mymood.forEach(function(d) {
d.timesUsed =+ d.timesUsed;
});
In the chrome console the error is happening at the line data.mymood.foreach line,
but i dont understand why because its exactly returning the same json as if there was no name like this
[object, object, object,object,object]
and the parameter d in the function also returns the same object within the array
edit
Error:
Uncaught TypeError: undefined is not a function
console.log(data) -> Object {mymood: Array[5]}
console.log(data.mymood) -> [Object, Object, Object, Object, Object]
gist for those who are interested in the full code
https://gist.github.com/gwong89/e3a29b64d94ad20256bb

Like Oscar had pointed out, the forEach loop works fine. However, after look closely at your gist, if you try to use the mymood key, make sure you also change line 55 where you were using
var g = svg.selectAll('g')
.data(pie(data))
to
var g = svg.selectAll('g')
.data(pie(data.mymood))
Also on line 76 where you had
var total = d3.sum(data.map(function(d) {
to
var total = d3.sum(data.mymood.map(function(d) {
I grabbed your project repo and tried these out on my local environment, and I can render the pie chart and popup without seeing any errors.

Your code seems to be working fine (from what I've tested). I will suggest to try debugging your code or if you feel more comfortable try doing many console.log(...) as possible and keep checking your browser console from the beginning (I have nothing else to say). Try to also use Developer Tools from Chrome which is a better option.
I've tried to replicate your context by using d3.js library and uploaded a json file with your data to my Dropbox just to be able to perform an ajax request and everything is fine again (also new JSON structure is valid). Here's what I did, probably could help you to learn something new (see below).
Possible hints/suggestions to fix your issue:
According to the question title, it seems that data.mymood is undefined so you are not able to do a forEach of something that doesn't exist. Try validating things and avoid null pointers (see example).
JSON structures are valid so that's not the problem.
Syntax seems to be valid from what I've tested.
Check if there's a conflict between libraries, try to do some research about using all the libraries needed together (not sure if this is your situation but could happen).
Check your browser console and do some debugging as the first paragraph says.
Check if your request is not timing out or something else is happening, check the Network tab or log your requests in browser console using Developer Tools from Chrome (just saying).
Live Demo: http://jsfiddle.net/29f6n8L7/
d3.json('https://dl.dropboxusercontent.com/u/15208254/stackoverflow/data.json', function(data) {
// Some ways to avoid null pointers
var obj = (data || {}), // If 'data' is null, initialize as an Object
moods = (obj.mymood || []), // If 'obj.mymood' is null, initialize as an Array
time = 0,
mood;
// Same way to get 'mymood' from the object
console.log('Your obj.mymood contains: %o', obj.mymood);
console.log('Your obj["mymood"] contains: %o', obj['mymood']);
/**
* I will suggest to use a traditional loop instead of 'forEach'.
* Please read: http://stackoverflow.com/a/9329476/1178686
* for a better explanation
*/
for (var i = 0; i < moods.length; ++i) {
mood = moods[i];
if (mood) {
time += mood.timesUsed;
}
}
// Output
console.log('Sum of timesUsed is: %s', time);
});

Arrays have a built in for each in es5, objects do not.

Reddit Api Error trying to get reddit self text via snoocore node.js

I'm tryng to get the self.text on a post and using this route:
reddit('/r/Denmark/comments/2jc5yk/how_to_live_in_denmark.json').listing({
context: 1,
limit: 10,
sort: 'hot',
})
.then(function(result) {
console.log(result);
});
I have also tried using .get(), without .json and without /how_to_live_in_denmark but still the same error.
When I input the route in my browser, I get the desired JSON.
The error i get:
Uncaught Error: Invalid path provided! This endpoint does not exist. Make sure that your call matches the routes that are defined in Reddit's API documentation
What am i doing wrong?

Update: 2015-02-09
Snoocore now accepts URLS's with embedded values and does not require placeholders if you do not wish to use them.
I'm the creator of this API wrapper. I'll have to monitor StackOverflow a little bit more to catch these quicker. Feel free to open new issues on GitHub as well when you get stuck on something for a quicker response!
It looks like you are trying to call this endpoint:
GET /r/[subreddit]/comments/article
Basically anything that is in brackets is optional in Snoocore, and anything in italics is an URL parameter that you will need to define placeholders for in the call (using $parameter). More information on this can be read in the documentation (feel free to ask questions or improve upon the documentation if it isn't clear!)
So in your case, you will want to do this:
reddit('/r/$subreddit/comments/$article').get({
$subreddit: 'Denmark',
$article: '2jc5yk',
context: 1,
limit: 10,
sort: 'hot'
}).done(function(result) {
console.log(result);
});
Note that instead of defining the url parameters in the call, the are now referenced by $subreddit and $article respectivly.
Note that comments are not a listing, and therefore can't use the listings interface as you tried to do in your question.