Fail to init ZAFClient | Community
Skip to main content

Fail to init ZAFClient

  • November 16, 2022
  • 3 replies
  • 0 views
camille13

Hi everyone,

I have a problem with my Zendesk support app.

I have an angular app that I try to integrate in Zendesk but ZAFClient.init() returns false.
So here is how I integrate my App :

inside of my zendesk folder

// production url of my angular app
<script src="https://myscript/script.js" type="module"></script>
// dev url of my angular app
<script src="localhost:4200/script.js" type="module"></script>    
<script src="https://static.zdassets.com/zendesk_app_framework_sdk/2.0/zaf_sdk.min.js"></script>

inside of my script.js simply call

 this._client = ZAFClient.init()
 console.log(this._client)
// prints false

I think I might have forgot something in configuration but cannot figure out what is, any idea ? Here is my manifest.json

{
"name": "Test",
"author": {
"name": "Test",
"email": "support@support.io",
},
"defaultLocale": "en",
"private": false,
"location": {
"support": {
"top_bar": "assets/iframe.html"
}
},
"version": "2.2",
"frameworkVersion": "2.0"
}

    3 replies

    Greg29
    • Greg29
    • November 16, 2022

    Hi Camille! I'm not familiar with Angular myself, but if you can provide the full snippets for how you are calling the ZAF client, I can bring it to the brain trust to see if we can help debug this!

    camille13
    • camille13
    • Author
    • November 23, 2022

    Hi @greg29

    Sorry for the late reply..

    Here is the code snippet

    publicoverrideinitialize(orchestrator: PlatformOrchestrator): void {
      super.initialize(orchestrator);
      this._client = ZAFClient.init();
    // console.log(this._client) prints the function, but function returns false...

    if (this._client) {
      this._client.invoke("resize", { width:"360px", height:"640px" });this._client.invoke("preloadPane");

      this.loggingService.log(LogLevel.Debug, 'SDK Client initialized', this.className);
    } else {
    this.loggingService.log(LogLevel.Error, 'Could not initialize SDK Client', this.className);
    }
    }
    camille13
    • camille13
    • Author
    • November 23, 2022

    Here is how SDK is required

    <!DOCTYPE html>
    <html lang="en" dir="ltr">
      <head>
        <meta charset="utf-8">
        <title>ZIWO Plugin</title>
        <base href="/">
        <meta name="viewport" content="width=device-width, initial-scale=1" />
        <link rel="stylesheet" href="ziwo.styles.css" media="print" onload="this.media='all'">
      </head>
      <body>
        <ziwo-root automation="pipedrive"></ziwo-root>
        <script src="ziwo.plugin.js" type="module"></script>
        <script src="ziwo.polyfills.js" type="module"></script>
      </body>
    </html>
    Terms & ConditionsCookie settingsAccessibility statement