TF-3622 Add integration test for case deformed inlined image

Signed-off-by: dab246 <tdvu@linagora.com>

core/lib/presentation/views/html_viewer/html_content_viewer_widget.dart

@@ -60,10 +60,10 @@ class HtmlContentViewer extends StatefulWidget {
   }) : super(key: key);
 
   @override
-  State<StatefulWidget> createState() => _HtmlContentViewState();
+  State<StatefulWidget> createState() => HtmlContentViewState();
 }
 
-class _HtmlContentViewState extends State<HtmlContentViewer> {
+class HtmlContentViewState extends State<HtmlContentViewer> {
 
   late InAppWebViewController _webViewController;
   late double _actualHeight;
@@ -79,6 +79,9 @@ class _HtmlContentViewState extends State<HtmlContentViewer> {
     verticalScrollBarEnabled: false,
   );
 
+  @visibleForTesting
+  InAppWebViewController get webViewController => _webViewController;
+
   @override
   void initState() {
     super.initState();

core/lib/utils/html/html_interaction.dart

@@ -120,6 +120,7 @@ class HtmlInteraction {
         }
     
         function removeWidthHeightFromStyle(style) {
+          // Remove width and height properties from style string
           style = style.replace(/width\\s*:\\s*[\\d.]+[a-zA-Z%]+\\s*;?/gi, '');
           style = style.replace(/height\\s*:\\s*[\\d.]+[a-zA-Z%]+\\s*;?/gi, '');
           style = style.trim();
@@ -130,6 +131,7 @@ class HtmlInteraction {
         }
     
         function extractWidthHeightFromStyle(style) {
+          // Extract width and height values with units from style string
           const result = {};
           const widthMatch = style.match(/width\\s*:\\s*([\\d.]+)([a-zA-Z%]+)\\s*;?/);
           const heightMatch = style.match(/height\\s*:\\s*([\\d.]+)([a-zA-Z%]+)\\s*;?/);
@@ -154,9 +156,24 @@ class HtmlInteraction {
         }
     
         function normalizeStyleAttribute(attrs) {
+          // Normalize style attribute to ensure proper responsive behavior
           let style = attrs['style'];
+          const widthStr = attrs['width'];
+          
           if (!style) {
-            attrs['style'] = 'display:inline;max-width:100%;';
+            if (!widthStr) {
+              attrs['style'] = 'max-width: 100%;height: auto;display: inline;';
+            } else {
+              if (!style.includes('height')) {
+                style += 'height: auto;';
+              }
+        
+              if (!style.includes('display')) {
+                style += 'display: inline;';
+              }
+        
+              attrs['style'] = style;
+            }
             return;
           }
     
@@ -175,40 +192,59 @@ class HtmlInteraction {
             }
           }
     
+          // Ensure proper style string formatting
           if (style.length && !style.endsWith(';')) {
             style += ';';
           }
     
+          // Add responsive defaults if missing
           if (!style.includes('max-width')) {
-            style += 'max-width:100%;height:auto;';
+            style += 'max-width: 100%;';
+          }
+    
+          if (!style.includes('height')) {
+            style += 'height: auto;';
           }
     
           if (!style.includes('display')) {
-            style += 'display:inline;';
+            style += 'display: inline;';
           }
     
           attrs['style'] = style;
         }
     
         function normalizeWidthHeightAttribute(attrs) {
+          // Normalize width/height attributes and remove if necessary
           const widthStr = attrs['width'];
           const heightStr = attrs['height'];
     
-          if (!widthStr || displayWidth === undefined) return;
+          // Remove attribute if value is null or undefined
+          if (widthStr === null || widthStr === undefined) {
+            delete attrs['width'];
+          } else if (displayWidth !== undefined) {
+            const widthValue = parseFloat(widthStr);
+            if (!isNaN(widthValue)) {
+              if (widthValue > displayWidth) {
+                delete attrs['width'];
+                delete attrs['height'];
+              }
+            }
+          }
     
-          const widthValue = parseFloat(widthStr);
-          if (isNaN(widthValue) || widthValue <= displayWidth) return;
-    
-          delete attrs['width'];
-          delete attrs['height'];
+          // Remove height attribute if value is null or undefined
+          if (heightStr === null || heightStr === undefined) {
+            delete attrs['height'];
+          }
         }
     
         function normalizeImageSize(attrs) {
-          normalizeStyleAttribute(attrs);
+          // Apply both style and attribute normalization
           normalizeWidthHeightAttribute(attrs);
+          normalizeStyleAttribute(attrs);
         }
     
         function applyImageNormalization() {
+          // Process all images on the page
           document.querySelectorAll('img').forEach(img => {
             const attrs = {
               style: img.getAttribute('style'),
@@ -218,16 +254,31 @@ class HtmlInteraction {
     
             normalizeImageSize(attrs);
     
-            if (attrs.style != null) img.setAttribute('style', attrs.style);
-            if ('width' in attrs) img.setAttribute('width', attrs.width);
-            else img.removeAttribute('width');
+            // Handle style attribute
+            if (attrs.style !== null && attrs.style !== undefined) {
+              img.setAttribute('style', attrs.style);
+            } else {
+              img.removeAttribute('style');
+            }
     
-            if ('height' in attrs) img.setAttribute('height', attrs.height);
-            else img.removeAttribute('height');
+            // Handle width attribute
+            if ('width' in attrs && attrs.width !== null && attrs.width !== undefined) {
+              img.setAttribute('width', attrs.width);
+            } else {
+              img.removeAttribute('width');
+            }
+    
+            // Handle height attribute
+            if ('height' in attrs && attrs.height !== null && attrs.height !== undefined) {
+              img.setAttribute('height', attrs.height);
+            } else {
+              img.removeAttribute('height');
+            }
           });
         }
         
         function safeApplyImageNormalization() {
+          // Error-safe wrapper for the normalization function
           try {
             applyImageNormalization();
           } catch (e) {
@@ -235,6 +286,7 @@ class HtmlInteraction {
           }
         }
         
+        // Run normalization when page loads
         window.onload = safeApplyImageNormalization;
       </script>
     ''';

core/lib/utils/platform_info.dart

@@ -5,6 +5,7 @@ import 'package:flutter/foundation.dart';
 abstract class PlatformInfo {
   @visibleForTesting
   static bool isTestingForWeb = false;
+  static bool isIntegrationTesting = false;
 
   static bool get isWeb => kIsWeb || isTestingForWeb;
   static bool get isLinux => !isWeb && defaultTargetPlatform == TargetPlatform.linux;