Skip to content

UI Text node does not render text correctly from payloads #1358

@houser42

Description

@houser42

Current Behavior

Example attached:
setting a UI Text node to font size 72 will not render outside of one row of tiles even if the text field has more rows.

The label field renders correctly and the payload field appears to change size correctly but is not visible outside one line. It looks like this when sending a string "payload size":
Screenshot 2024-10-03 at 16 36 17

Expected Behavior

Text should render to available rows, as does the label.

Steps To Reproduce

Inject node and text node to replicate;

[
    {
        "id": "2f6e9e78d20dd769",
        "type": "ui-text",
        "z": "796f3b88e7b62f92",
        "group": "abd66337a03c3786",
        "order": 1,
        "width": "17",
        "height": "5",
        "name": "test size",
        "label": "label size ",
        "format": "",
        "layout": "row-center",
        "style": true,
        "font": "Arial,Arial,Helvetica,sans-serif",
        "fontSize": "72",
        "color": "#ffffff",
        "className": "",
        "x": 560,
        "y": 280,
        "wires": []
    },
    {
        "id": "43aafe37e3bb9881",
        "type": "inject",
        "z": "796f3b88e7b62f92",
        "name": "",
        "props": [
            {
                "p": "payload"
            },
            {
                "p": "topic",
                "vt": "str"
            }
        ],
        "repeat": "",
        "crontab": "",
        "once": false,
        "onceDelay": 0.1,
        "topic": "",
        "payload": "payload size",
        "payloadType": "str",
        "x": 250,
        "y": 260,
        "wires": [
            [
                "2f6e9e78d20dd769"
            ]
        ]
    },
    {
        "id": "abd66337a03c3786",
        "type": "ui-group",
        "name": "g1",
        "page": "93df70a8e08be29e",
        "width": "30",
        "height": "1",
        "order": 1,
        "showTitle": true,
        "className": "",
        "visible": "true",
        "disabled": "false"
    },
    {
        "id": "93df70a8e08be29e",
        "type": "ui-page",
        "name": "test git p1",
        "ui": "cd62f850b848415c",
        "path": "/page18",
        "icon": "home",
        "layout": "grid",
        "theme": "404b2b83a6155d6c",
        "breakpoints": [
            {
                "name": "Default",
                "px": "0",
                "cols": "3"
            },
            {
                "name": "Tablet",
                "px": "576",
                "cols": "6"
            },
            {
                "name": "Small Desktop",
                "px": "768",
                "cols": "9"
            },
            {
                "name": "Desktop",
                "px": "1024",
                "cols": "12"
            }
        ],
        "order": 17,
        "className": "",
        "visible": true,
        "disabled": false
    },
    {
        "id": "cd62f850b848415c",
        "type": "ui-base",
        "name": "flax 24",
        "path": "/dashboard",
        "includeClientData": true,
        "acceptsClientConfig": [
            "ui-notification",
            "ui-control"
        ],
        "showPathInSidebar": false,
        "showPageTitle": false,
        "navigationStyle": "none",
        "titleBarStyle": "hidden"
    },
    {
        "id": "404b2b83a6155d6c",
        "type": "ui-theme",
        "name": "dark jtm",
        "colors": {
            "surface": "#000000",
            "primary": "#0094ce",
            "bgPage": "#000000",
            "groupBg": "#000000",
            "groupOutline": "#000000"
        },
        "sizes": {
            "pagePadding": "12px",
            "groupGap": "12px",
            "groupBorderRadius": "4px",
            "widgetGap": "12px",
            "density": "comfortable"
        }
    }
]```

### Environment

- Dashboard version:
- Node-RED version: 4.0.2
- Node.js version:
- npm version:
- Platform/OS: Ubuntu
- Browser: any browser on Mac.


### Have you provided an initial effort estimate for this issue?

I am not a FlowFuse team member

Metadata

Metadata

Assignees

Labels

bugSomething isn't workingsize:XS - 1Sizing estimation point

Type

No type

Projects

Status

Done

Status

Done

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions