Entering more than 999775 characters breaks text_area

[Shawn Z]

Describe the bug
Entering more than 999775 characters breaks rx.text_area. If you enter more than 999775 characters into a text area you will have to refresh the page for the text_area to work again.

To Reproduce
Steps to reproduce the behavior:

import reflex as rx
import pyperclip

class State(rx.State):

    def print_length(self, value: str):
        print(len(value))

    def copy_to_clipboard(text_length):
        # Copy 'text_length' number of 'a's to the clipboard
        text_length = 999776    # Fails
        # text_length = 999775  # Works
        text = 'a' * text_length
        pyperclip.copy(text)
        print(f"Copied {text_length} characters to the clipboard.")

def index() -> rx.Component:
    return rx.center(
        rx.text_area(
            on_change=State.print_length,
            height="50vh",
            width="50vw",
        ),
        height="100vh",
    )

app = rx.App()
app.add_page(index, on_load=State.copy_to_clipboard)

Expected behavior
The text area should behave the same way that it does when you enter less than 999776 characters.

Specifics (please complete the following information):

• Python Version: 3.11.6
• Reflex Version: 0.4.7
• OS: Ubuntu 23.10
• Browser (Optional): Chrome & Firefox

[Angelina Sheyko]

Hi!

This error happens because the size of a message sent from browser to backend by default is limited to ~1Mb, you can see this limitation here in code. In reflex.App you can pass your custom socket engine in sio argument and socket app in socket_app argument. However, I found a bug that these args are not used. In PR #3170 I suggest a fix to this problem.

If it will be merged, you can pass any max buffer size to sio and your code will work as expected.
Example:

import reflex as rx
from socketio import AsyncServer

import pyperclip


class State(rx.State):

    def print_length(self, value: str):
        print(len(value))

    def copy_to_clipboard(self):
        # Copy 'text_length' number of 'a's to the clipboard
        text_length = 999776   # Works
        text = 'a' * text_length
        pyperclip.copy(text)
        print(f"Copied {text_length} characters to the clipboard.")


def index() -> rx.Component:
    return rx.center(
        rx.text_area(
            on_change=State.print_length,
            height="50vh",
            width="50vw",
        ),
        height="100vh",
    )

sio=AsyncServer(
            async_mode="asgi",
            cors_allowed_origins=(
                "*"
            ),
            cors_credentials=True,
            max_http_buffer_size=50000000000,
            ping_interval=120,
            ping_timeout=240)

app = rx.App(sio=sio)
app.add_page(index, on_load=State.copy_to_clipboard)

You can find socketio docs for maximum buffer size max_http_buffer_size here
Reflex docs for sio and socket_app kwargs here