Opened 8 years ago

Closed 6 years ago

Last modified 6 years ago

#13875 closed defect (fixed)

joAdding hrefTarget="_self" breaks page animation

Reported by: Paul Christopher Owned by: Patrick Ruzand
Priority: high Milestone: 1.9.1
Component: DojoX Mobile Version: 1.7.0b1
Keywords: Cc:
Blocked By: Blocking:

Description

Steps to reproduce:

  • Take dojox/mobile/tests/test_iPhone-Icon.html
  • Click on the fifth icon to see a working page transition of type slide.
  • Now add hreftTarget="_self" to the fifth IconItem in the source code like so:

<li dojoType="dojox.mobile.IconItem" label="href" icon="images/icon-1.png" href="test_iPhone-RoundRectList.html" hrefTarget="_self" transition="slide"></li>

  • Reload the page: The animation will be broken, i.e. the is no anomation at all.

The same is not only true for IconItem but ListItem. Appending hrefTarget="_self" to the list item breaks the animation, too.

Example:

<li dojoType="dojox.mobile.ListItem" rightText="AcmePhone" href="test_iPhone-RoundRectList.html" hrefTarget="_self" transition="slide">

Why do I add hrefTarget="_self"?

I add hrefTarget since I develop my apps on the desktop pc. My index.html file just constains an iframe in iPad size (1024*768). All the pages of the app are run inside this iframe so as to simulate the screen resolution of the target device.

[As of today 9/9/2011, the mentioned test does not work at all since all images are reported as corrupted/truncated by the browser. You need to replace the images first to get the test working]

Attachments (4)

ticket13875.patch (2.8 KB) - added by Sebastien Brunot 6 years ago.
Apply transition to element with href and hrefTarget defined if hrefTarget is _self (IBM CCLA)
test2.html (1.1 KB) - added by Sebastien Brunot 6 years ago.
Test file that tries to reproduce the issue observed on Android.
_ItemBase.js (14.0 KB) - added by jmg157 6 years ago.
My patched _ItemBase.js file
ViewController.js (8.6 KB) - added by jmg157 6 years ago.
My patched _ViewController.js file

Download all attachments as: .zip

Change History (16)

comment:1 Changed 6 years ago by ykami

Owner: changed from ykami to Eric Durocher
Status: newassigned

Changed 6 years ago by Sebastien Brunot

Attachment: ticket13875.patch added

Apply transition to element with href and hrefTarget defined if hrefTarget is _self (IBM CCLA)

comment:2 Changed 6 years ago by Sebastien Brunot

I've attached a patch that fix the problem for dojo 1.9

comment:3 in reply to:  2 Changed 6 years ago by jmg157

I've tried this patch on both Dojo 1.9 and Dojo 1.8 but still seem to have no luck. I tested it using Phone Gap on Android Jellybean (4.1) and Gingerbread (2.3).

After making the modifications mentioned in the patch, the animations still do not seem to work.

Here is how I am attempting to implement the transition:

<span data-dojo-type="dojox/mobile/ToolBarButton"
                    href="prevpage.html" hrefTarget="_self"
                    data-dojo-props='arrow:"left",
                    transition:"slide"'>Prev</span>

I'm not sure if I am doing something wrong or if there is an issue with the patch.

Thank you.

Best,

--Josh

Replying to sbrunot:

I've attached a patch that fix the problem for dojo 1.9

Last edited 6 years ago by jmg157 (previous) (diff)

comment:4 Changed 6 years ago by Sebastien Brunot

I tried to reproduce on Android 2.3.3 and 4.1.2 emulators with the patch on 1.9, using the test case dojox/mobile/tests/test_IconContainer.html (clicking the "hrefTarget" icon), but I can't (works with the original swirl transition and the slide transition).

Could you attach a complete HTML test page that fails on your devices with the patch on 1.9 ?

Thanks for your help.

comment:5 Changed 6 years ago by jmg157

The problem I'm having is actually with ToolBarButton?. The slide transition works fine with the dojox/mobile/tests/test_IconContainer.html case. But when I try to implement a slide transition for the toolbar buttons as above, the animation does not work. The page transitions, but without animation.

comment:6 Changed 6 years ago by Adrian Vasiliu

Milestone: tbd1.9.1

comment:7 Changed 6 years ago by Sebastien Brunot

I unfortunately do not reproduce the issue with the attached test2.html file when running in the android stock browser. Before I test by embedding the test file in a PhoneGap? / Apache cordova application, can you tell me if test2.html reproduce the issue when embedded in your application ?

Changed 6 years ago by Sebastien Brunot

Attachment: test2.html added

Test file that tries to reproduce the issue observed on Android.

comment:8 Changed 6 years ago by jmg157

Hmmm...I must be doing something wrong. This is my entire HTML file:

<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet"
	href="../../libs/dojo/dojox/mobile/themes/android/android.css"
	type="text/css" media="screen" title="notitle" charset="utf-8">
<script type="text/javascript" src="../../libs/dojo/dojo/dojo.js"
	djConfig="parseOnLoad:true"></script>
<script type="text/javascript">
	dojo.require("dojox.mobile.parser");
	dojo.require("dojox.mobile");
	dojo.require("dojox.mobile.ContentPane");
	dojo.require("dojox.mobile.ToolBarButton");
	dojo.require("dojox.mobile.Heading");
	dojo.requireIf(!dojo.isWebKit, "dojox.mobile.compat");
</script>
</head>
<body>
	<div data-dojo-type="dojox/mobile/View">
		<div id="header" data-dojo-type="dojox/mobile/Heading">
			<span data-dojo-type="dojox/mobile/ToolBarButton"
				href="../../index.html" hrefTarget="_self"
				data-dojo-props='arrow:"left", transition:"slide"'>Home</span>
		</div>
	</div>
</body>
</html>

I'm also attaching my _ItemBase.js and ViewController?.js files where I applied the patch.

Oh, and yes, when I tried your test file, I had the same problem.

Thank you again for all the help!

Last edited 6 years ago by jmg157 (previous) (diff)

Changed 6 years ago by jmg157

Attachment: _ItemBase.js added

My patched _ItemBase.js file

Changed 6 years ago by jmg157

Attachment: ViewController.js added

My patched _ViewController.js file

comment:9 Changed 6 years ago by Sebastien Brunot

Thanks for sending your example. Unfortunately, I tested it both on the Android 4.1.2 stock browser and in a cordova 2.7 application, using your version _ItemBase.js and ViewController?.js on the dojo 1.9 branch source code, and it works perfectly.

I'm affraid you have a build, cache od deployment issue at this point :(

comment:10 Changed 6 years ago by Patrick Ruzand

Owner: changed from Eric Durocher to Patrick Ruzand

comment:11 Changed 6 years ago by Patrick Ruzand <pruzand@…>

Resolution: fixed
Status: assignedclosed

In dd7a76c32f46df3160222a126bf05a5be890afed/dojox:

Error: Processor CommitTicketReference failed
Unsupported version control system "git": Can't find an appropriate component, maybe the corresponding plugin was not enabled? 

comment:12 Changed 6 years ago by Patrick Ruzand <pruzand@…>

In 699ff816ee8c5e9abd3557ae639f9c797fcbd53b/dojox:

Error: Processor CommitTicketReference failed
Unsupported version control system "git": Can't find an appropriate component, maybe the corresponding plugin was not enabled? 
Note: See TracTickets for help on using tickets.