Split screen / mushup slots not generated

[wojtek1171]

After upgrading to 0.28.0 views using multiple plugins in split windows aka mashups are not generated on reTerminal-e1001. Only white/blank .png is generated on server side and sent back to the device. GET EP returns 200. Same plugins in full window view are generated correctly.
Also interesting thing is that at the same time my Nook Simple Touch can handle split view without issues.

Part of the log from e1001 (nothing unusual):

[16:49:06]I: src/api-client/display.cpp [27]: Added headers:
[16:49:06]Model: reTerminal E1001
[16:49:06]RSSI: -45
[16:49:06]
[16:49:09]I: src/api-client/display.cpp [95]: GET... code: 200
[16:49:09]I: src/api-client/display.cpp [99]: Content size: 343
[16:49:09]I: src/api-client/display.cpp [100]: Free heap size: 217076
[16:49:09]I: src/api-client/display.cpp [101]: Payload - {"status":0,"image_url":"https:\/\/my.srvr.url\/storage\/images\/generated\/5e0e5c73-7788-4334-8563-1a5e896d0a12.png","filename":"5e0e5c73-7788-4334-8563-1a5e896d0a12.png","refresh_rate":15000,"reset_firmware":false,"update_firmware":false,"firmware_url":null,"special_function":"sleep","maximum_compatibility":false,"image_url_timeout":30}
[16:49:09]I: lib/trmnl/src/special_function.cpp [27]: New special function - sleep
[16:49:09]I: src/bl.cpp [927]: status: 0
[16:49:09]I: src/bl.cpp [2006]: SF saved. Reading...
[16:49:09]I: src/bl.cpp [2009]: No needed to re-write
[16:49:09]I: src/bl.cpp [953]: image_url: https://my.srvr.url/storage/images/generated/5e0e5c73-7788-4334-8563-1a5e896d0a12.png
[16:49:09]I: src/bl.cpp [954]: image url end with: 0
[16:49:09]I: src/bl.cpp [959]: flag: 0
[16:49:09]I: src/bl.cpp [988]: End with NO empty_state
[16:49:09]I: src/bl.cpp [1004]: New filename - 5e0e5c73-7788-4334-8563-1a5e896d0a12.png
[16:49:09]E: src/bl.cpp [2104]: Current filename: 
[16:49:10]E: src/bl.cpp [2113]: Current filename doesn't equal to the new filename
[16:49:10]I: src/bl.cpp [1007]: New image. Show it.
[16:49:10]I: src/bl.cpp [1018]: update_firmware: 0
[16:49:10]I: src/bl.cpp [1024]: refresh_rate: 15000
[16:49:10]I: src/bl.cpp [1043]: result - 0
[16:49:10]I: lib/trmnl/include/http_client.h [25]: ==== withHttp() https://my.srvr.url/storage/images/generated/5e0e5c73-7788-4334-8563-1a5e896d0a12.png
[16:49:10]I: src/bl.cpp [668]: GET...
[16:49:10]I: src/bl.cpp [669]: RSSI: -47
[16:49:10]E: src/bl.cpp [685]: [HTTPS] GET... code: 200
[16:49:10]I: src/bl.cpp [686]: RSSI: -47
[16:49:10]I: src/bl.cpp [693]: Content size: 249
[16:49:10]I: src/bl.cpp [704]: RSSI: -47
[16:49:10]I: src/bl.cpp [705]: Stream timeout: 1000
[16:49:11]I: src/bl.cpp [707]: Stream available (may show as 0 and that's okay): 249
[16:49:11]I: src/bl.cpp [711]: Starting a download at: 1770997750
[16:49:11]I: src/bl.cpp [908]: Downloading... Available bytes: 249
[16:49:11]I: src/bl.cpp [915]: Download end: 249/249 bytes in 11 ms (1 iterations)
[16:49:11]I: src/bl.cpp [733]: Received successfully; WiFi off; WiFi off

From server logs I can see only EP with 200 status. Probably can't investigate it any further.

I'm back on 0.27.0 at the moment and views are generated correctly.

[bnussbau]

Thanks for your report. Could you test 0.28.0 again but with environment variables

TRMNL_BLADE_FRAMEWORK_CSS_VERSION=2.2.1
TRMNL_BLADE_FRAMEWORK_JS_VERSION=2.1.0

I haven’t changed the mashup generation logic, so I want to rule out that the TRMNL Design Framework is causing this.
v0.28 bumps the CSS framework to v2.3.1, and there have been multiple reports of broken layouts on Discord. (for the Core service)

[wojtek1171]

Still the same with the env vars. I don't know if it makes any difference here but all my plugins use liquid for templates rather then blade.

[bnussbau]

Could you share one example (markup of both recipes used in a mashup together)? At the moment, I’m unable to reproduce this issue in version 0.28.0 with the default variables.

[wojtek1171]

I tried now with simple:

<div class="view view--{{ size }}">
 Test
</div>

and the same in the second plugin. Result - nothing generated.

But when I removed view--{{ size }} it started to work correctly, so it seems there is something with that variable on split windows. However when I try:

<div class="view">
  Test {{ size }}
</div>

Picture is generated with Test half_vertical so variable is read correctly

---

Edit:

After additional checks I noticed something else. So far I have been using Seed E1001 Monochrome as the Device Model and a blank screen was generated. When I use other models settings with the same dimensions (for example TRMNL OG (1-bit), Waveshare 7.5 B/W, or a custom 800x480), the image is generated with the correct split and CSS styles but the grayscale is different (it’s lighter). Screen is blank with TRMNL OG (2-bit), Seed E1001, or XteInk X4.

[bnussbau]

Thank you, i have been able to reproduce this. Seems like the css class og_plus is no longer working in combination with screen--2bit. When replacing screen--og_plus with screen--ogv2, it renders again.

Rendering blank

<html lang="en">

<head>
    <meta charset="utf-8">
    <link rel="preconnect" href="https://fonts.bunny.net">
    <link href="https://fonts.bunny.net/css?family=Inter:300,400,500" rel="stylesheet">
    <link rel="stylesheet" href="https://trmnl.com/css/2.2.1/plugins.css">
    <script src="https://trmnl.com/js/2.1.0/plugins.js"></script>
    <title>TrmnlServer</title>
</head>

<body class="environment trmnl">
    <div class="screen   screen--og_plus  screen--2bit ">
        <div class="mashup mashup--1Tx1B">
            <div class="view view--half_horizontal">
                <div class="layout">
                    <p class="title">A</p>
                </div>
                <div class="title_bar">
                    <span class="title">TRMNL BYOS</span>
                </div>
            </div>
        </div>
    </div>


</body>

</html>

Rendering correctly

<html lang="en">

<head>
    <meta charset="utf-8">
    <link rel="preconnect" href="https://fonts.bunny.net">
    <link href="https://fonts.bunny.net/css?family=Inter:300,400,500" rel="stylesheet">
    <link rel="stylesheet" href="https://trmnl.com/css/2.2.1/plugins.css">
    <script src="https://trmnl.com/js/2.1.0/plugins.js"></script>
    <title>TrmnlServer</title>
</head>

<body class="environment trmnl">
    <div class="screen   screen--ogv2  screen--2bit ">
        <div class="mashup mashup--1Tx1B">
            <div class="view view--half_horizontal">
                <div class="layout">
                    <p class="title">A</p>
                </div>
                <div class="title_bar">
                    <span class="title">TRMNL BYOS</span>
                </div>
            </div>
        </div>
    </div>


</body>

</html>

[bnussbau]

Should be fixed in 0.28.1

[wojtek1171]

It is 👌 Thank you and have a great Sunday!

[wojtek1171]

Hi. I updated to 31.4 from 28.1 (I skipped recent updates) and stumbled upon the same issue again

[jasonwaters]

i'm seeing the same issue as well

[jasonwaters]

Thanks for the mashup support — sharing a generic workaround in case others hit the same issue with duplicated/mismatched content when the same plugin appears multiple times in one mashup.

Symptom

When two instances of the same plugin are shown side by side, one tile may fail to render correctly or both tiles may show the same data.

Why this happens

Mashup tiles are rendered into a shared page context, so plugin markup/scripts can collide if they use:

• hardcoded DOM IDs (id="chart", id="title", etc.)
• global JS symbols/functions/variables reused across instances

Workaround pattern (plugin-side)

Use an instance-safe pattern for every plugin that may appear more than once:

1. Generate a per-instance suffix once in shared template code.

   • Example: {% assign instance_suffix = "plugin" | append_random %}

2. Derive all JS-targeted IDs from that suffix.

   • chart-{{ instance_suffix }}
   • title-{{ instance_suffix }}
   • etc.

3. Wrap shared JS in an IIFE (or equivalent) so runtime data/config are not global.

4. Register per-instance init in a keyed registry on window.

   • Example shape: window.__pluginInstances[instance_suffix] = { initialize }

5. In each layout, call only that specific instance’s initializer.

This made duplicate-plugin mashups render correctly and independently.

Recommendation for larapaper (resilience)

A few platform-level improvements could reduce this class of bug:

• Provide a documented per-tile instance key in Liquid context (e.g. tile_id / instance_id) for deterministic namespacing.
• Add docs warning that mashup scripts share global scope and include an “instance-safe plugin” best-practice example.
• Optional: evaluate stronger tile/script isolation to prevent cross-instance JS interference.

[bnussbau]

Please make sure to containerize your code and make chart ids unique, as the markup of the recipes will be appended when rendering the mashup. Here is a troubleshooting guide: https://help.trmnl.com/en/articles/10168132-mashups#h_d8837b6acf