sayden / relay-mongoose-example

An example Relay application
Other
58 stars 8 forks source link

Blank landing page #1

Open sayden opened 8 years ago

sayden commented 8 years ago

@spyalert01 (I put here your issue)

Hi @sayden , I downloaded your script. and npm run update-schema, then npm run start. I goto browser, and I see blank page. How should I run and test your script and mutation?

Here is my UserSchema =========== user schema start =========

let UserSchema = new mongoose.Schema({
  id: {
    type: String,
    required: true,
    unique: true,
    index: true,
    default: mongoose.Types.ObjectId
  },
  name: String,
  surname: String,
});

UserSchema.set('toJSON', {getters: true});
let ModUser = mongoose.model('User', UserSchema);

exports.UserSchema = ModUser;

exports.getModUserById = () => {
  return new Promise((resolve, reject) => {
    ModUser.findOne().exec((err, res) => {
      if(err){
        reject(err);
      }else{
        resolve(res);
      }
      //err ? reject(err) : resolve(res);
    })
  });
};

================ user schme stop ===========

and here is my schema.js

==== partial schema.js start -======

import ModUser from './modules/ModUser.js';

var appUserType = new GraphQLObjectType({
  name: 'AppUser',
  description: 'A person who uses our app',
  fields: () => ({
    id: globalIdField('AppUser'),
    name: {
      type: GraphQLString,
      description: 'The name of User',
    },
    surname: {
      type: GraphQLString,
      description: 'The surname of User',
    },
  }),
  interfaces: [nodeInterface],
});

var queryType = new GraphQLObjectType({
  name: 'Query',
  fields: () => ({
    node: nodeField,
    // Add your own root fields here
    appsales: {
      type: appSalesType,
      resolve: () => getAppSales(),
    },
    appuser: {
      type: appUserType,
      resolve: () => {
        console.log('aaaa', ModUser.getModUserById);
        ModUser.getModUserById;
      },
    }, 
  }),
});

==== partial schema.js stop -======

when the script executed it goes to var queryType ---> appuser In the browser grapqhql post (inspect element i see result NULL)

in the CLI if I console.log('aaa', ModUser.getModUserById) it shows

return new Promise((resolve, reject) => {
  ModUser.findOne().exec((err, res) => {
    if(err){
      reject(err);
    }else{
      resolve(res);
    }
    //err ? reject(err) : resolve(res);
  })
});

If I use console.log('aaa', ModUser.getModUserById) I get the following in CLI

aaaa { 'Symbol(record)_3.aa68p23em81714i':
{ p: [Circular],
  c: [],
  a: undefined,
  s: 0,
  d: false,
  v: undefined,
  h: false,
  n: false } }

What could have been wrong in my script?

sayden commented 8 years ago

Hi @spyalert01 Unfortunately I'm out of the country and I have very limited access and time until one week so I cannot directly test your code.

For me, it could be few things:

var queryType = new GraphQLObjectType({
  name: 'Query',
  fields: () => ({
    node: nodeField,
    // Add your own root fields here
    appsales: {
      type: appSalesType,
      resolve: () => getAppSales(),
    },
    appuser: {
      type: appUserType,
      // You are not executing the function getModUserById
      resolve: () => {
        console.log('aaaa', ModUser.getModUserById);
        ModUser.getModUserById;
      },
    }, 
  }),
});

Should be more like this:

var queryType = new GraphQLObjectType({
  name: 'Query',
  fields: () => ({
    node: nodeField,
    // Add your own root fields here
    appsales: {
      type: appSalesType,
      resolve: () => getAppSales(),
    },
    appuser: {
      type: appUserType,
      //HERE give the function directly
      resolve: ModUser.getModUserById,
    }, 
  }),
});

Also in UserType declaration you are using globalIdField that I didn't use so it could be causing some side-effect problem

spyalert01 commented 8 years ago

Hi @sayden, Thanks. It is working now. the globalIDField is fine. just need to give the function directly. But I don't understand why it cannot be resolve: () => ModUser.getModUserById? and I thought of doing a console there to see if the result really return or not. What is the best way to test the script if not console.log? Any suggestion?

sayden commented 8 years ago

This () => ModUser.getModUserById? will never work as you are not executing the function but just providing it to this scope. However this...

appuser: {
      type: appUserType,
      // You are not executing the function getModUserById
      resolve: () => {
        console.log('aaaa', ModUser.getModUserById);
        return ModUser.getModUserById();
      },
    }, 

...should work as you are executing the function a returning its result (a promise). Notice the () at the end of getUserById() this time

spyalert01 commented 8 years ago

@sayden Thanks a lot for your comment. I tried the server.js with the webpack configuration inside (for development purpose) I notice the loading is very slow. And I also tried taking webapck configuration, and use webpack.config.js to compile the client side, and use the remain clean server side to run as server.

Both environment the loading is also slow as compare to when I was doing with Flux+Alt+Store+Actions. Do you have experience about this? and how can I make it running as fast ?

spyalert01 commented 8 years ago

@sayden I need to use the connectionFromArray to return the value that returning ModUser.getModUserById() In the resolve, I do this:

resolve: () => {
    (async function(){
        return connectionFromArray(await ModUser.getModUserById(), args);
    }()).catch((e)=>{
    });
},

But the Result doesn't return. If I console.log(connectionFromArray(await ModUser.getModUserById(), args)) before the return, in the CLI I already see the result that I am expecting. What could be wrong?

sayden commented 8 years ago

I cannot test your code exactly but GraphQL need a Promise that will give it the result, but not the result itself. I think that if you try this it could be fixed:

resolve: () => {
    return Promise.resolve(connectionFromArray(await ModUser.getModUserById(), args));
}
spyalert01 commented 8 years ago

Will give it a try. Thanks.

mahesh08 commented 8 years ago

@spyalert01 I am also getting empty screen for this project. If you don't mind can you share your working code. my mail id is "mahesh.g@stellentsoft.com". Thanks in advance.