[TIMOB-20482] iOS: WebView converting spaces into extra lines

GitHub Issue	n/a
Type	Bug
Priority	High
Status	Closed
Resolution	Fixed
Resolution Date	2017-05-06T14:36:01.000+0000
Affected Version/s	Release 5.2.0
Fix Version/s	Release 6.1.0
Components	iOS
Labels	merge-6.1.0, webview
Reporter	Michael Thornton
Assignee	Vijay Singh
Created	2016-02-27T01:21:01.000+0000
Updated	2017-05-09T16:39:22.000+0000

Description

I am loading content into a WebView container using both setUrl and setHtml. Both methods seem to be adding additional lines based on the number of spaces found (seems to be inconsistent). A workaround was to convert the spaces to , but then word wrap did not work correctly.

Attached zip containing examples.

Attachments

File	Date	Size
Screen Shot 2017-03-15 at 1.55.38 PM.png	2017-03-15T21:06:52.000+0000	44945
webview_example.zip	2016-02-27T01:21:02.000+0000	1205

Comments

Nazmus Salahin 2016-02-28

I have tested this issue on Android and IOS. I have loaded content into a WebView container using both setUrl and setHtml. In either case, no additional line added based on number of spaces. The issue is not reproducible.

   senderMessage.setUrl("spaces.html");
   //senderMessage.setHtml("This is a test");
   senderMessage.setHeight(Ti.UI.SIZE); 
             
   moreMessage.setUrl("more_spaces.html");
   //moreMessage.setHtml("This is a test That is a test That is a test");
   moreMessage.setHeight(Ti.UI.SIZE);

[Screenshot image link](http://postimg.org/image/d7np93n4j/) *Environment*:

   *Device info:* Nexux7 (android 6.0.1)
   *Node.js Version:* 0.12.7
   *npm Version:* 2.11.3
   *Titanium SDKs:* 5.2.0.v20160220080449 and 5.1.2.GA
   *Java Development Kit Version:* 1.8.0_73
   *Titanium CLI Version:*  5.0.5
   
   And :
   Operating System
     Name                        = Mac OS X
     Version                     = 10.9.5
     Architecture                = 64bit
     # CPUs                      = 4
     Memory                      = 8589934592
   Node.js
     Node.js Version             = 0.12.7
     npm Version                 = 2.11.3
   Titanium CLI
     CLI Version                 = 5.0.6
   Titanium SDK
     SDK Version                 = 5.2.0.GA
     SDK Path                    = /Users/gsl-mac-mini-08/Library/Application Support/Titanium/mobilesdk/osx/5.2.0.GA
     Target Platform             = iphone

Michael Thornton 2016-02-28

First, thanks for the quick reply. Much appreciated to see such great developer support! I created a new project using the 5.2.0 GA SDK to make sure my app was not causing an issue. I tested this using Genymotion Google Nexus 6 - 5.1.0 - API 22 and it appeared ok. When I tested using iOS simulator in Appcelerator Studio for the iPad 2 and iPhone 6 it was still an issue. I also tested on an iPad Air 2 and it was still an issue. I have multiple users that are experiencing the issue on their individual iPad's. It looks like it may just be an iOS issue. Can you verify using the iOS simulator for iPad 2 in Appcelerator? How do I compare my environment settings with settings that were posted? Maybe I need an update. I am running OS X with the most recent update of Appcelerator. I just updated on 2/27/2016 and when I check for updates Appcelerator studio says I am current.
Vijay Singh 2017-03-15

I am unable to reproduce the issue. It looks either it is fixed in this version or it may be some problem with iOS version. [~ewieber] Can you please verify it .
Eric Wieber 2017-03-15

I am able to reproduce this issue, using: MacOS 10.12 (16A323) Studio 4.8.1.201612050850 Ti SDK 6.0.2.GA Appc NPM 4.2.8 Appc CLI 6.1.0 Alloy 1.9.5 Xcode 8.2.1 (8C1002) iOS 10 iPhone 6 sim Using the provided example I see the extra spaces after the text in the html files. See the attached image. !Screen Shot 2017-03-15 at 1.55.38 PM.png|thumbnail!
Vijay Singh 2017-03-17

Thanks [~ewieber] . PR: https://github.com/appcelerator/titanium_mobile/pull/8892

Vijay Singh 2017-03-29

The issue mentioned in this ticket is due to one change while fixing TIMOB-11777. Probable test case which [~ssekhri] has given me for the ticket TIMOB-11777 ( It was verified by him in early 2013 :) ) -

   var win = Ti.UI.createWindow();
   
   var webview = Ti.UI.createWebView({
   
       width:Ti.UI.SIZE,
   
       height:Ti.UI.SIZE,
   
       html:'<html><body style="height:200px;width:100px;border:1px solid #ccc;padding:10px">200 px height, 100 px width.</body></html>'
   
   });
   
   win.add(webview);
   
   win.open();

it is also working fine with above PR.

Hans Knöchel 2017-05-03

Backport for 6.1.0 please
Vijay Singh 2017-05-04

Backported PR (6_1_X): https://github.com/appcelerator/titanium_mobile/pull/9012
Eric Wieber 2017-05-04

FR passed, using: MacOS 10.12 (16A323) Studio 4.9.0.201704061825 Ti SDK 6.1.0 Appc NPM 4.2.9 Appc CLI 6.2.0 Alloy 1.9.11 Xcode 8.3.2 (8E2002) No additional lines were shown when setting the webview to a local file, using setHTLP or setURL. Tested using the provided sample with modifications.
Eric Wieber 2017-05-09

Closing. Verified in builds: 6.1.0.v20170504081641 6.2.0.v20170507073539

JSON Source