3

I've been struggling for a few days to get JSS Integrated GraphQL running on an existing SXA project. To rule out any issues being introduced by this project, I decided to go right back to square one, make a clean install of my Sitecore environment and document each step as I go to reproduce my issue.

There's a lot of information below, but I believe it's required to get a proper diagnosis.


Sitecore environment setup

I performed a clean install with the following;

  • Sitecore.NET 9.2.0 (rev. 002893)
  • Sitecore PowerShell Extensions-5.0 for 9.2
  • Sitecore Experience Accelerator 1.9.0 rev. 190528 for 9.2
  • Sitecore JavaScript Services Server for Sitecore 9.2 XP 12.0.0 rev. 190522

JSS app setup

Following this guide https://doc.sitecore.com/developers/sxa/19/sitecore-experience-accelerator/en/create-a-jss-tenant-and-site.html

  1. Created JSS Tenant and JSS Site in Sitecore
  2. Created an API Key
  3. Tested JSS server components with [host]/api/layout/render/jss?item=/&sc_apikey={[api key]} and getting back the 400 - API key is not valid error as is expected
  4. Used JSS CLI to create a new React site (Node.js v12.13.1)
  5. Ran JSS setup
  6. Copied Deployment Secret to /sitecore/content/JSS Tenant/JSS Site/Settings
  7. Skipped the config deployment as per documentation
  8. Copied the example endpoint config, updated the XML and url param and placed into \App_Config\Include\zzz
  9. Verified my JSS app runs OK locally with jss start
  10. Tried to import JSS app to Sitecore using jss deploy app --includeContent --includeDictionary, it throws an error;
Unexpected response from import service:
Status message: Bad Request
Body: Could not find JSS app configuration for 'jsssxasite'. Ensure you have included or previously installed a configuration patch file for the JSS app. Running 'jss deploy config' may resolve this.

Then I remembered reading this article today that my JSS site name should match up exactly with the SXA JSS Site name - "Could not find JSS app configuration" when deploying JSS app into JSS-SXA Site

  1. Created new JSS Site with name that matches my JSS App (jss-sxa-site), deleted old Site with Remove Site script.
  2. Tried to import JSS app to Sitecore using jss deploy app --includeContent --includeDictionary, it works!

JSS app build artifacts have been deployed to Sitecore


Testing out my app

  1. The /home item from JSS Site opened in Preview and Edit modes just fine
  2. Tested the GraphQL endpoint I created earlier (in the config) through the GraphiQL GUI (incognito mode) using the query below and it works, I get back the expected data
{
 item(path: "/sitecore/content/JSS Tenant/jss-sxa-site/home") {
   id
   path
   children {
     name
   }
   template {
      fields {
       name
     }
   }
 }
}
  1. I tried to open home/graphql page from my app in in Edit or Preview mode, it throws an error:
Error Rendering Sitecore.JavaScriptServices.ViewEngine.Presentation.JsLayoutRenderer: Cannot read property 'datasource' of undefined TypeError: Cannot read property 'datasource' of undefined at GraphQLIntegratedDemo

I found this article Integrated GraphQL is not executed in Experience Editor

  1. Tried setting the Layout service configuration from sxa-jss to jss inside the JSS Site settings.
  2. Got the same error when opening the page again:
Error Rendering Sitecore.JavaScriptServices.ViewEngine.Presentation.JsLayoutRenderer: Cannot read property 'datasource' of undefined TypeError: Cannot read property 'datasource' of undefined at GraphQLIntegratedDemo

Well done for getting this far!! :-)

Did I find a bug? Or did I just miss something?

  • 1
    Regardless of SXA, you need to define your app via a config file. The SXA multi site manager doesn’t work correctly. – Mark Cassidy Dec 23 '19 at 10:38
  • Thanks Mark! Are you referring to the config deployment? (step 7 in the 'JSS App Setup')? – JKD Dec 23 '19 at 10:41
  • 1
    @JKD please navigate to sitecore/content/JSS Tenant/JSS Site/Settings and check what value is set up into "Layout service configuration" field? – Vadzim Papko Dec 31 '19 at 11:40
  • Thanks for that Vadzim.. I came back to work after the Christmas break and got this working after following Marks advice! I will update my question with the answer now. – JKD Jan 2 at 11:45
4

This is a problem that falls on the unfortunate spot in between SXA, JSS, and Sitecore Services Client. I know it doesn't help you to know that these are somewhat separate development teams inside Sitecore, but I do believe that's where this falls.

Using the new SXA/JSS features in 9.2 and above, we've also found that some Api calls and GraphQL calls fail to work correctly on an SXA-only configured JSS app. The workaround for us (as you found to be working as well) was to do an "old style" manual configuration of the JSS app.

I don't believe it should be necessary and am inclined to see this as a bug. For now however, this is the workaround.

| improve this answer | |

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.