CODEWITHSUNDEEP
javajavafxwebviewline-breaks
tquadrat
tquadrat

Reputation: 4044

JavaFX WebView shows Rectangles for line breaks in HTML Source

I use a JavaFX WebView control to display some static HTML documents inside my application. Unfortunately, the line breaks from the HTML file are displayed as rectangles in the WebView.

For the snippet below from the HTML file it looks like the screen shot underneath:

<p>Users can also have roles within the application, and they can be
    members of groups; both can be defined freely, although some sample roles
    and groups will be created with the installation.</p>

Appearance in WebView

Note the rectangles between be members and roles and. When copying the sequence and pasting it to a text editor, there are no special characters (therefore I have to present a screen shot here …).

Use this MWE to reproduce the issue:

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.layout.VBox;
import javafx.scene.web.WebView;
import javafx.stage.Stage;

public class MWE extends Application
{

    public static void main( String... args )
    {
        launch( args );
    }

    public void start( Stage primaryStage )
    {
        primaryStage.setTitle( "Minimal Working Example" );

        final var webView = new WebView();

        webView.getEngine().loadContent(
            """
            <p>Users can also have roles within the application, and they can be
              members of groups; both can be defined freely, although some sample roles
              and groups will be created with the installation.</p>
            """
        );

        final var vBox = new VBox( webView );
        final var scene = new Scene( vBox, 960, 600 );

        primaryStage.setScene( scene );
        primaryStage.show();
    }
}

I am using Java 21.0.1 with JavaFX 21.0.3 on Ubuntu 22.04.4 LTS. And originally, the HTML is read from a file.

Just as a side node: when I translate a Markdown file to HTML and display the result, I see the same rectangles on where the Markdown source had the line breaks.

Any ideas how I could get rid of those rectangles? Other than reformatting the HTML, of course.

Upvotes: 5

Views: 116

Answers (1)

Thomas Sch&#252;tt
Thomas Sch&#252;tt

Reputation: 949

Not a real solution, but the change would be minimal.

webView.getEngine().loadContent(
        """
        <p>Users can also have roles within the application, and they can be
          members of groups; both can be defined freely, although some sample roles
          and groups will be created with the installation.</p>
        """.replaceAll("\n", " ")
    );

I am not sure if this counts as "Other than reformatting the HTML". If not, please excuse.

Upvotes: 1

Related Questions