Cypress: type tab key - testing

I want to test that my forms are accessible and that I can tab between my input elements. I found this github issue asking for the feature here:
https://github.com/cypress-io/cypress/issues/299
Currently I try to do .type('{tab}') and I get the following error:
CypressError: {tab} isn't a supported character sequence. You'll want to use the command cy.tab(), which is not ready yet, but when it is done that's what you'll use.
Is there a current workaround for the lack of tab support?

The Cypress team is currently working on implementing tab support along with other keyboard keys as part of Native Events
In the meantime I've made a plugin that adds a .tab() command. cypress-plugin-tab:
This enables you to do:
cy.get('input').tab()
// and
cy.get('input').tab({shift: true})
However, the actual tab implementation will not be a separate command, so know if you use this plugin, you'll have to refactor your test code when Native Events lands
As the cypress documentation says:
In the meantime, you can use the experimental cypress-plugin-tab and can thumbs up this issue.

Related

Anyway to highlight and select data in Chrome dev tools sources tab scope sidebar via chrome extension?

chrome.devtools.panels.sources Seems to be the api of choice here.
Specifically the onSelectionChanged.addListener function.
The problem is this function works everywhere but the sidebars where the debugger data is located.
Is this a joke? Why would google expose an api to modify the debugger UI without also exposing access to its values?
I must be missing something here right?
Specifically I want to select a value in the scope sidebar that appears during debugging, and then run a function on that value that transforms it and displays the transformed value within a tooltip or popup.
I briefly considered the chrome.debugger api but it is mutually exclusive with an open dev tools instance. It’s for “remote” debugging.

Prevent my Elm app from crashing when a 3rd party changes the DOM

I have an Elm app. A while ago I realized that my app was crashing locally when I used FontAwesome icons. I came to understand that it happened because I chose SVG icons and therefore FontAwesome was modifying the DOM. That conflicted with Elm's VDOM mechanism.
This was easy to fix--I migrated to the CSS version of FontAwesome that uses pseudo elements. Recently some users complained that the app in production freezes and they showed screenshots of states that were not matching the log data I had. It took a while until I realized that all these users had Google Translate automatically translated the page for them. Google Translate clearly alters the DOM, so I'm not surprised that it made Elm crash.
How can I prevent my Elm app from crashing? Is there a way to be notified if a 3rd party changes the DOM? So that I could even notify the user that they have an extension that interferes with the app.
I had the same problem as you and solved it by migrating to the Elm-FontAwesome library. Basically all you have to do is replace this syntax:
i [ Svga.class "fas fa-check" ] []
with this one:
Icon.viewIcon Icon.check
You can have a look to the example project for more details: https://github.com/Lattyware/elm-fontawesome-example
Have a look here - How we made Elm and Google Translate work together.
Their approach is to hijack the Elm replaceData method that is called by Elm during dom updates using the function below. You would run this just before giving Elm control of the dom.
HTMLFontElement.prototype.replaceData =
function replaceData(_0, _1, string) {
this.parentNode.replaceChild(
document.createTextNode(string),
this
);
};
Apparently, "Google Translate replaces every text node in the DOM with a tag containing at least one more tag – one for each sentence". For example:
<span>Insurello. Rätt ersättning till alla</span>
is translated into
<span><font><font>Insurello. </font><font>The right compensation for everyone</font></font></span>
This method avoids attempting to edit the span and instead replace it with a new one. Once the node is added, Google Translate will translate that text.
I don't know about preventing the crashes, but I think you should be able to register changes to the DOM with the current mutation observer API.
Before that were several deprecated mutation events like DOMSubtreeModified that could also help, but well they are deprecated.
This problem is very closely linked to that of Google Maps or Google Places Autocomplete in Elm. The solution I've used in the past is to provide a childless div with an id I can point to from JavaScript.
Because the div is childless, Elm does not look under the hood to check whether it has changed internally.
Check out this blog post or google "maps in elm" for instructions on how to do this
-- EDIT --
Ive read the question better and this will probably not work for Google translate issues as it changes all text in the entire DOM. Ill leave it here incase the question brings otger people who have more regular problems caused when a 3rd party changes the DOM

The number of times a custom event happened is not being updated on my dashboard

I've been able to distinguish between the live build and the test build on my Android app. Everything works perfectly on the test version. I can see the live events and when I go and see the number of clicks for an event, that gets updated too. However, on the live build of my app, I can see the live events but the number of clicks is not being updated. All the events still show empty analytics. What could be wrong?
Amruta from Branch.io here:
Based on your description it looks like your App is still using the test key. If your App has both the Live and Test key added to the Manifest, and you have the debug mode enabled, your App will continue using the Test key. You should make sure that your App is using the Live key.
You can ensure that your app is using the Live key by using a Branch link from the Live version of your App. On clicking on the link, the link parameters received in the callback should have the parameter '+clicked_branch_link: true'.
If the parameter 'clicked_branch_link' is set to false it means that your App is still using the test key.
If you still continue to face issues, I would suggest writing to integrations#branch.io and they can help you resolve any issues you are facing.

Verifying toasts using Appium , and get server reaction to button clicks

i'm new to android automation testing and i recently started to work with Appium.
I use it for android native app automation.
I have 2 question -
is there a way to verify toasts?
the latest posts i saw which referred to this issue are from the mid of 2014
and i wanted to know if there's something new in this subject before i will find another tool to run my tests with (as i understand selendroid can verify toasts).
is there a way to catch the http request which my app sends to the server when i'm pressing a button, during the automatic test?
something like a listener which works in the backround and wait for clicks?
tnx
To verify toast messages you can use one of image recognition libraries. For ruby I use RTesseract together with image processor RMgick
Idea is simple:
make toast message to appear
take few screenshots
iterate over taken screenshots and look for text
You may play with image processing, to increase recognition quality.
Here you can find code snippet which I use in my framework: link

Standalone video control example for Google TV jQuery Library?

The jQuery VideoControl is documented here:
https://developers.google.com/tv/web/lib/jquery/#gtv.jq.VideoControl
It takes a set of VideoParms. That are not specified.
It is used in the sample templates on this page:
https://developers.google.com/tv/web/docs/gtv-templates
I've taken apart the templates, but I'm having difficulty creating a simple example of a standalone video control. In the templates, the sidenav and carousel code are tied to how the videocontrol works. There is a relationship between the keyController and behavior (behaviorZones) that I can not find an explanation for.
Is there a standalone example somewhere? What needs to be setup with keycontroller, css, and behavior to get this going?
I'm not aware that there is a standalone videocontrol.js sample but it should be possible to set it up. Most of the necessary pieces are inside videocontrol.js, in particular in the videocontrol's constructor and this function: gtv.jq.VideoControl.prototype.makeControl.
keycontroller mapping is used to handling key inputs and some of the CSS are dynamically controlled within JS so there might be errors if you just rip them apart straight from the Template. You'd have to debug it using a solid tool like Chrome Developer Tools. You can watch tutorials of this tool here: http://www.youtube.com/results?search_query=chrome+developer+tools&oq=chrome+develop&aq=0&aqi=g3g-m2&aql=&gs_sm=3&gs_upl=1972l4015l0l6142l14l11l0l0l0l0l207l1476l3.5.3l11l0
Otherwise please send your error traces and/or code snippet for debugging help.
S