Facebook playable black screen

[roleplaydiary]

We've uploaded the playable to Facebook Ads Manager and it has no errors, but black screen. Cocos Creator ver.3.8.2(Also tried in 3.6.0)

All the other versions work perfect(Unity, Iron Source, and etc.), facebook also works perfectly fine locally and in facebook playable preview tool.

And even empty project with just the background doesn't work.

Thank you in advance.

[roleplaydiary]

Also, we tried to investigate the problem and find that the code stuck in System.import. Maybe it helps with solving the problem.

[WillYuum]

@roleplaydiary when you mentioned System.import, do you mean the one in the export js file? and if that's the case what was the alternative to that?

[Elai06]

I also have a black screen in ads manager

[IIAjaXII]

Does anyone have a solution to this problem? I have the same problem in ads manager.

[yosajka]

@roleplaydiary Did you manage to solve this? I have the exact same problem

[Kodedyukh]

Good news everyone!

I've found a solution for this issue, it stills looks like a workaround and is not heavily tested but works for me.

In your FB build you have a number of 'indexN.js' files in a js folder. You need to find one with __adapter_init_js() function definition (it is usually index5.js).

By default this function looks like (beautified version)

function __adapter_init_js() {
        const r = System.__proto__.createScript;
        System.__proto__.createScript = function(e) {
            var t = __adapter_get_script(e.replace(__adapter_get_base_url(), ""));
            return t ? (t = new Blob([t], {
                type: "text/javascript"
            }), r.call(this, URL.createObjectURL(t))) : (console.error(e + " 找不到资源"), r.call(this, e))
        }
    }

You need to replace it with function of just script creation and launch a load event on that element

function __adapter_init_js() {
        System.__proto__.createScript = function(e) {
            var t = __adapter_get_script(e.replace(__adapter_get_base_url(), ""));
            var s = document.createElement("script");
            s.async = !0,
            s.crossOrigin = "anonymous";
            s.text = t;
            setTimeout(() => {
                s.dispatchEvent(new Event("load"));
            });
            return s;
        }
    }

A bit of reflection on the issue: it looks like Fb just blocks scripts that are dynamically added to the document with src property, but they works fine when added with text on innerHTML property. The problem is that you can't get 'load' event emitted when you add script with innerHTML. So that's what I do in this solution - just add scripts with text property and emit 'load' after

[yosajka]

@Kodedyukh Your solution works great! Thanks!

[rcstamp]

@Kodedyukh thanks

[chikinov]

@Kodedyukh The solution won't work on 3.8.x if Spine is used.

[Tvix57]

@Kodedyukh The solution won't work on 3.8.x if Spine is used.

Did u find solution for Spine?

[chikinov]

@Kodedyukh The solution won't work on 3.8.x if Spine is used.

Did u find solution for Spine?

No. I downgraded my project to 3.7.4.

[littlesome]

  function __adapter_init_js() {
    System.__proto__.createScript = function(e) {
        var t = __adapter_get_script(e.replace(__adapter_get_base_url(), ""));
        var s = document.createElement("script");
        setTimeout(() => {
          eval(t);
          s.dispatchEvent(new Event("load"));
        });
        return s;
    }
  }

try this one if you are using 3.8.x with Spine, this works for me, wish you good luck!