scrollToVisible error while testing on a device, UIAutomation - ui-automation

For this line of test code : view.scrollViews()[0].tapWithOptions({tapOffset:{x:0.32, y:0.25}})
I am getting this error
2012-11-02 18:09:23 +0000 None: Script threw an uncaught JavaScript error: target.frontMostApp().mainWindow().scrollViews()[0] could not be tapped on line 244 of feature.js
2012-11-02 18:09:23 +0000 Debug: target.frontMostApp().mainWindow().scrollViews()[0].tapWithOptions({tapOffset:{x:"0.32", y:"0.25"}})
2012-11-02 18:09:23 +0000 Debug: target.frontMostApp().mainWindow().scrollViews()[0].scrollToVisible()
2012-11-02 18:09:23 +0000 Debug: target.frontMostApp().mainWindow().scrollViews()[0] - scrollToVisible cannot be used on the element because it does not have a scrollable ancestor.
2012-11-02 18:09:23 +0000 Debug: target.frontMostApp().mainWindow().scrollViews()[0] - scrollToVisible cannot be used on the element because it does not have a scrollable ancestor.
2012-11-02 18:09:23 +0000 Debug: target.frontMostApp().mainWindow().scrollViews()[0] could not be tapped
The logelement tree looks like this
UIATarget "MyiPadname" {{0, 0}, {1024, 768}}
elements: {
UIAApplication "myAppName" {{0, 0}, {1024, 768}}
elements: {
UIAWindow "(null)" {{0, 0}, {1024, 768}}
elements: {
UIAScrollView "(null)" {{0, 0}, {1024, 768}}
elements: {
UIAImage "(null)" {{1017, 761}, {7, 7}}
UIAImage "(null)" {{1017, 761}, {7, 7}}
}
UIAImage "nav_bar.png" {{0, 724}, {1024, 44}}
UIAButton "button featured" {{0, 730}, {134, 39}}
UIAButton "See the world" {{134, 730}, {223, 39}}
UIAButton "button my favorites" {{357, 730}, {180, 39}}
UIAButton "button settings" {{967, 736}, {33, 27}}
}
}
}
I am using XCode 4.5.1 . Can anyone help me to fix this . Thanks

Are you, by any chance, using iOS 5.x simulator or iOS 5.x device? If yes then I am seeing the same issue. I believe Xcode 4.5.1 does not like ScrollViews.
But, I found a workaround.
My element is looks like :
target.frontMostApp().mainWindow().scrollViews()[0].buttons()["Wikipedia"]
So, instead of accessing the button directly, I am trying to access a staticText for the button.
target.frontMostApp().mainWindow().scrollViews()[0].buttons()["Wikipedia"].staticTexts()["Wikipedia"].tap();
I hope this works for you.

I am getting the same error when doing flickInsideWithOptions on a scroll view. I believe that the automation framework is trying to scroll to the element you want to tap first but if the scrolling is disabled for some reason, it fails with the error you mentioned.
There is only one way how to fix it - the automation framework can't know that we are tapping into a scroll view - we have to avoid its special versions of the tap/swipe/flick functions. We will tap on mainWindow instead, e.g.
var buttonRect = button.rect();
var windowRect = mainWindow.rect();
var xPos = (20 + buttonRect.origin.x) / windowRect.size.width;
var yPos = (50 + buttonRect.origin.y) / windowRect.size.height;
mainWindow.tapWithOptions({tapOffset:{x:xPos, y:yPos}});

Related

how to change the active/selected element position in the category with slick slider

is it possible to show the active/selected element in the screen visible while selected, with the slick slider?
currently, I have a category on the page that has a swipe/slide feature implemented with a slick slider for mobile view
when I select any menu from the last category or any selected, it's not visible when it is active/selected
sharing image for reference:
there are 4 categories page 1 page 2 page 3 page 4 in the page where page 4 is already selected which has a border-button: yellow when it is selected, but as you can see in the reference image it is not visible on the screen, the user needs to slide category to check the selected one
any idea, if this can be done from slick or CSS?
if(jQuery(window).width() < 640) {
jQuery('#category').slick({
dots: false,
infinite: false,
speed: 300,
slidesToShow: 1,
centerMode: false,
variableWidth: true,
prevArrow: false,
nextArrow: false,
mobileFirst: true
});
}

How do I get a variety of transition mode types in my JSSOR slide show?

I am building a pretty good JSSOR slide show, with what must be recognized as very good support by jssor on StackOverflow. I'm also completely amazed that the best slideshow program in the world is free.
My slideshow does a "chess mode" type animation mode on every slide. What I am looking for is a variety of transition modes (I call them transition modes, but maybe that is the wrong term?).
Example:
"ChessMode" slide show
But I want something more like this:
JSSOR image-gallery demo
I think the secret lies in the _SlideshowTransitions array values, but I don't know what the full range of possibilities are, or how to make multiple effects modes within one slide show.
These are my _SlideshowTransitions settings:
var _SlideshowTransitions = [{
$Duration: 600,
$Delay: 50,
$Cols: 8,
$Rows: 4,
$FlyDirection: 5,
$Formation:
$JssorSlideshowFormations$.$FormationZigZag,
$Assembly: 1028,
$ChessMode: { $Column: 3, $Row: 12 },
$Easing: { $Left: $JssorEasing$.$EaseInCubic, $Top: $JssorEasing$.$EaseInCubic, $Opacity: $JssorEasing$.$EaseOutQuad },
$Opacity: 2
}];
I see you use only one transition, please use more transitions in following manner,
var _SlideshowTransitions = [
{ code1 },
{ code2 },
{ code3 },
...
];
Get transition code at http://www.jssor.com/development/tool-slideshow-transition-viewer.html

Nav Bar height is 43 pts?

According to every online resource, the Nav Bar height should be 44pts (88px on Retina screens).
Indeed, when I take a screenshot of my iPhone (see below), the Status bar's height is 20pts, and the NavBar's height is 44pts, but that's split into a 1pt white pixels, and 43 "blue" pixels:
When I develop my app and create a NavBar (standard), there is no "white" pixel between the StatusBar and the NavBar, so the NavBar's height is 43pts (and not 44pts). This makes the inner window 1pt higher:
My entire code is simply 5 lines (app.js):
var mainWindow = Titanium.UI.createWindow();
var innerWindow = Titanium.UI.createWindow({ title : "Settings" });
var navGroup = Titanium.UI.iPhone.createNavigationGroup({ window : innerWindow });
mainWindow.add(navGroup);
mainWindow.open();
Any ideas??
Maybe it'll help some one some day, if you add "top : 0" when creating the NavigationGroup, you'll get that extra pixel line :)
var navGroup = Titanium.UI.iPhone.createNavigationGroup({ top : 0, window : innerWindow });
Since iOS 6 you've got a 1 point shadow line under the navigation bar.
This may be the cause of you problem.

fancybox - popup window size

I am using FancyBox and I am having a slight problem.
I have a box, that is 930px wide where users can interact with things inside the popup.
The problem is, when a user in using a screen resolution that is, lets say 800x600, some of the items in the box do not display. The box has a fixed height and width (930x400).
I have tried to use scrolling: auto and scrolling: yes but nothing seems to work
Is there a way around this?
Thanks
UPDATE: - Included code snippet
$.fancybox({
"padding" : 3,
"type":"iframe",
"href":"/requirements/"+$(".sf_admin_form_field_id div.content").html()+"/edit?req_id="+$(this).children(".id").children("div").children("input").val(),
"width" : 934,
"height" : 391,
"overlayShow": true,
"overlayOpacity" : 0,
"scrolling" : "yes",
"onClosed" : function(){ window.location.reload();
}
Try
scrolling: 'auto' (note the quotes!)
and if this does not work can you include the fancybox initializer that you are using??

Sencha Fullscreen Panel that detects Home Screen Bookmark?

When using Sencha Touch to create a panel - you can tell the panel to enable a fullscreen property. THe panel will fill the space available by the device.
It seems to have a bug or not deal with a bookmark that has been saved to the home screen - and floats underneath the status bar at the top.
Is there a property or setting to manage this behaviour OR are am I going to have to program the logic to determine how much padding is required dependent on device and orientation ?
Example below will fit nicely in mobile Safari, but if you save to Home Screen and load it up - the Toolbar sits underneath the Status Bar.
var buttons = [
{text: 'Button'},
{xtype: 'spacer'},
{text: 'Blue', ui: 'action'},
];
var toolbar1 = new Ext.Toolbar({
dock: 'top',
title: 'Panel',
items: buttons
});
var windowHeight = Ext.Element.getViewportHeight();
var windowWidth = Ext.Element.getViewportWidth();
var homePage = new Ext.Panel ({
fullscreen: true,
cls: 'homePage',
dockedItems: [toolbar1],
layout: 'fit',
html: '<h2>Testing Ext.js Panel</h2><p>Height:' + windowHeight +'</p><p> Width:' + windowWidth +'</p>',
animation: 'slide'
});
Thanks in advance.
Hi Ket — This is actually the default behavior... The status bar is always visible, even in a fullscreen web app. There are three tips you may find useful:
You can use a translucent statusbar, which is still there but will overlay your content. To do this, in Ext.setup(), you can use "statusBarStyle: 'black-translucent'"
"window.navigator.standalone" will detect whether you're in fullscreen mode or not.
Instead of measuring window width/height, you could break your H2 and P into separate components, and give the P area a layout of 'fit'
Hope that helps-