# Dispatching of NgRx Action & Creating Screenshots

**URL:** <https://forum.babylonjs.com/t/dispatching-of-ngrx-action-creating-screenshots/41974>\
**Category:** Bugs\
**Created:** [June 27, 2023, 10:15am UTC](https://forum.babylonjs.com/t/dispatching-of-ngrx-action-creating-screenshots/41974 "2023-06-27T10:15:00Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![LKHDev](https://avatars.discourse-cdn.com/v4/letter/l/54ee81/32.png) [@LKHDev](https://forum.babylonjs.com/u/LKHDev)\
**Post date:** [June 27, 2023, 10:15am UTC](https://forum.babylonjs.com/t/dispatching-of-ngrx-action-creating-screenshots/41974/1 "2023-06-27T10:15:00Z")

</div>

Hi,

I’m experiencing a possible race condition with updating the Babylon render state and subsequently taking a screenshot of the render using _CreateScreenshotUsingRenderTarget_.

**Output (Babylon JS 6.9.0)**

![blacksquares](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/3X/d/5/d5cfdd73ba5e056d5eb80f2cce745536a2835378.png)

**Desired Output (Babylon JS 4.2.1)**

![normal](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/3X/f/b/fb91b690b83fef47ac73ffb16c4e669475179625.png)

**Code**

```auto

let options: Options = { … };
this.store.dispatch(RenderOptionsChangedAction(options));

BabylonTools.CreateScreenshotUsingRenderTarget(this.engine, this.camera, { height: 1200, width: 1400 }, (data: string) => {

  this.store.dispatch(SaveScreenshotAction(data.replace('data:image/png;base64,', '')));*
  callback();

});

```

**Analysis**

The dispatching of an action to update the Babylon render on line 2 is causing the display issue shown above. NgRx is used to dispatch the action. Note this action causes a re-draw of the entire scene.

Attempts to wrap this code into an NG Zone or Promise to ensure the action has completed before the screenshot is taken have failed.

I am using Babylon JS 6.9.0 with the latest versions of NgRx and AngularJS. Note that this issue was not present when using Babylon JS 4.X.X. A recent update to 6.X.X has caused this issue.

The text annotations are TextBlock objects, I have explored and exhausted issues relating to colour, alpha and transparency. Please note that other created objects, not shown in the screenshots, such as Lines and Boxes are not affected – it is just the TextBlock objects.

My question is, how do we ensure the render is ready for the screenshot to be taken ? Furthermore, why would only TextBlock objects be affected and not other object types ?

Many Thanks.

---

<div class="post-metadata">

**Author:** ![carolhmj](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/carolhmj/32/25918_2.png) [@carolhmj](https://forum.babylonjs.com/u/carolhmj)\
**Post date:** [June 27, 2023, 1:23pm UTC](https://forum.babylonjs.com/t/dispatching-of-ngrx-action-creating-screenshots/41974/2 "2023-06-27T13:23:19Z")

</div>

Hello,

Are you able to share a small reproduction of your project?

The GUI has its own guiIsReady function: [AdvancedDynamicTexture | Babylon.js Documentation (babylonjs.com)](https://doc.babylonjs.com/typedoc/classes/BABYLON.GUI.AdvancedDynamicTexture#guiIsReady), but the only case where it isn’t ready by default is the Image, so it shouldn’t change anything in your case. It will be easier to see with a repro.

---

<div class="post-metadata">

**Author:** ![LKHDev](https://avatars.discourse-cdn.com/v4/letter/l/54ee81/32.png) [@LKHDev](https://forum.babylonjs.com/u/LKHDev)\
**Post date:** [June 27, 2023, 2:28pm UTC](https://forum.babylonjs.com/t/dispatching-of-ngrx-action-creating-screenshots/41974/3 "2023-06-27T14:28:07Z")

</div>

Hi [carolhmj](https://forum.babylonjs.com/u/carolhmj),

Thanks for the reply.

Unfortunately not yet, this is in progress. Once I have the reproduction project repo I’ll post it.

I was making an initial post to see if there was anything obvious I was missing.

The AdvancedDynamicTexture’s are not images so yes this is not relevant in my case.

---

<div class="post-metadata">

**Author:** ![LKHDev](https://avatars.discourse-cdn.com/v4/letter/l/54ee81/32.png) [@LKHDev](https://forum.babylonjs.com/u/LKHDev)\
**Post date:** [July 17, 2023, 4:30am UTC](https://forum.babylonjs.com/t/dispatching-of-ngrx-action-creating-screenshots/41974/4 "2023-07-17T04:30:17Z")

</div>

Hi @carolhmj,

To update you on this.

I was able to workaround the problem by changing to a _Mesh_ object type when required - I found that this did not trigger the bug.

I also had to wrap my screenshot logic in an _executeWhenReady_ check to ensure the scene was fully rendered. If this wasn’t in place the annotations were missing from the screenshot. Note using _executeWhenReady_ with the _TextBlock_ type still triggers the above bug.

This leads me to believe that the scene is not ready when taking the screenshots with the _TextBlock_ type.

Does BabylonJS have the necessary logic in-place to ensure the _TextBlock’s_ are fully rendered before the screenshot is taken ? It is interesting how _executeWhenReady_ resolves the issue for _Mesh_ object types but not _TextBlock_ object types - maybe the problem lies here ?

I’ll be working on my reproduction project soon and I’ll keep you posted.