Remove repeating br tags from html before render (#288)

surveyjs · Feb 27, 2024 · 4172731 · 4172731
1 parent 0fa7f9b
commit 4172731
Show file tree

Hide file tree

Showing 2 changed files with 28 additions and 3 deletions.
diff --git a/src/flat_layout/flat_html.ts b/src/flat_layout/flat_html.ts
@@ -5,6 +5,7 @@ import { FlatQuestion } from './flat_question';
 import { FlatRepository } from './flat_repository';
 import { IPdfBrick } from '../pdf_render/pdf_brick';
 import { SurveyHelper } from '../helper_survey';
+import { replace } from 'lodash';
 
 export type IHTMLRenderType = 'auto' | 'standard' | 'image';
 export class FlatHTML extends FlatQuestion {
@@ -21,6 +22,16 @@ export class FlatHTML extends FlatQuestion {
         }
         return 'standard';
     }
+
+    private static correctHtmlRules: [{ searchRegExp: RegExp, replaceString: string }] = [
+        { searchRegExp: /(<\/?br\s*?\/?\s*?>\s*){2,}/, replaceString: '<br>' }
+    ]
+    protected correctHtml(html: string): string {
+        FlatHTML.correctHtmlRules.forEach((rule) => {
+            html = html.replace(rule.searchRegExp, rule.replaceString);
+        });
+        return html;
+    }
     public async generateFlatsContent(point: IPoint): Promise<IPdfBrick[]> {
         let renderAs: IHTMLRenderType = <IHTMLRenderType>this.question.renderAs;
         if (renderAs === 'auto') renderAs = this.controller.htmlRenderAs;
@@ -29,12 +40,12 @@ export class FlatHTML extends FlatQuestion {
         if (renderAs === 'image') {
             const width: number = SurveyHelper.getPageAvailableWidth(this.controller);
             const { url, aspect }: { url: string, aspect: number } =
-                await SurveyHelper.htmlToImage(html, width, this.controller);
+            await SurveyHelper.htmlToImage(html, width, this.controller);
             const height: number = width / aspect;
             return [await SurveyHelper.createImageFlat(point, this.question, this.controller, { link: url, width, height })];
         }
         return [SurveyHelper.splitHtmlRect(this.controller, await SurveyHelper.createHTMLFlat(
-            point, this.question, this.controller, html))];
+            point, this.question, this.controller, this.correctHtml(html)))];
     }
 }
 

diff --git a/tests/flat_html.test.ts b/tests/flat_html.test.ts
@@ -2,7 +2,7 @@
     return {};
 };
 
-import { Question } from 'survey-core';
+import { Question, QuestionHtmlModel } from 'survey-core';
 import { SurveyPDF } from '../src/survey';
 import { IPoint, IRect, DocController, IDocOptions } from '../src/doc_controller';
 import { FlatSurvey } from '../src/flat_layout/flat_survey';
@@ -77,4 +77,18 @@ test('Check createHTMLRect method with long html', async () => {
     controller.helperDoc.addPage();
     actualRect = SurveyHelper.createHTMLRect(descPoint, controller, margins, result);
     expect(actualRect.yBot - actualRect.yTop).toBeCloseTo(427.2, 8);
+});
+
+test('Check correctHtml method with multiple br tags', async () => {
+    let survey: SurveyPDF = new SurveyPDF({}, TestHelper.defaultOptions);
+    SurveyHelper.shouldConvertImageToPng = false;
+    let controller: DocController = new DocController(TestHelper.defaultOptions);
+    const htmlFlat = new FlatHTML(survey, new QuestionHtmlModel('q1'), controller);
+    expect(htmlFlat['correctHtml']('<span>Test</span><br>')).toEqual('<span>Test</span><br>');
+    expect(htmlFlat['correctHtml']('<span>Test</span><br><br>')).toEqual('<span>Test</span><br>');
+    expect(htmlFlat['correctHtml']('<span>Test</span><br>  <br>')).toEqual('<span>Test</span><br>');
+    expect(htmlFlat['correctHtml']('<br><span>Test</span><br>')).toEqual('<br><span>Test</span><br>');
+    expect(htmlFlat['correctHtml']('<br><br/>')).toEqual('<br>');
+    expect(htmlFlat['correctHtml']('<br / ><br>')).toEqual('<br>');
+    expect(htmlFlat['correctHtml']('<br></br>')).toEqual('<br>');
 });