Closed Bug 1206093 Opened 4 years ago Closed 4 years ago

[Messages][Tests] Leverage "client.switchToShadowRoot" to tap on gaia-header action button

Categories

(Firefox OS Graveyard :: Gaia::SMS, defect, minor)

ARM
Gonk (Firefox OS)
defect
Not set
minor

Tracking

(Not tracked)

RESOLVED FIXED

People

(Reporter: azasypkin, Assigned: martianwars, Mentored)

References

()

Details

(Whiteboard: [lang=js])

Attachments

(1 file)

Recently Marionette Client started to support querying of elements that are located inside shadow DOM. So now we can get rid of our hack with "HTMLEvents" and make test flow more natural.

E.g we can rewrite this [1]:

this.Composer.header.scriptWith(function(header) {
  var event = document.createEvent('HTMLEvents');
  event.initEvent('action', true, true);
  header.dispatchEvent(event);
});

with:

this.client.switchToShadowRoot(this.Composer.header);
this.Composer.headerActionButton.tap();
this.client.switchToShadowRoot();


[1] https://github.com/mozilla-b2g/gaia/blob/3e9de022ede11800170b6665606cb00c3fd92dc5/apps/sms/test/marionette/lib/messages.js#L211
would doing this much suffice?
Where else would I have to change code?
Attachment #8663418 - Flags: review?(azasypkin)
Comment on attachment 8663418 [details] [review]
Checking out example code fix

Hey Kalpesh,

Thanks for your interest in this bug!

I've added some comments at the PR, but if you have any questions or doubts just ping me here or on IRC (azasypkin).

And ask for review again whenever you're ready.
Attachment #8663418 - Flags: review?(azasypkin)
I did a few changes. Getting a TypeError. Could you see the code for any major error once?
(In reply to Kalpesh Krishna from comment #4)
> I did a few changes. Getting a TypeError. Could you see the code for any
> major error once?

We're getting closer, commented at Github :)
I figured out a few things. Couldn't understand why messages.js needs changes. The relevant parts seem to be coded
(In reply to Kalpesh Krishna from comment #6)
> I figured out a few things. Couldn't understand why messages.js needs
> changes. The relevant parts seem to be coded

Replied at GitHub, basically you need changes in lib/messages.js because you have to add "headerActionButton" property to Report and Participants objects that are defined there.

Again, I'd recommend you to run Messages app in browser [1] to get better understanding of what "action button" is and how Messages app looks like :)

[1] https://github.com/mozilla-b2g/gaia/blob/master/apps/sms/README.md#how-to-run-the-application-in-firefox
@azasypkin :- Yeah now things make sense :) . I have made a few changes and pushed again. 

I had an issue with my npm due to which I was unable to setup the test environment. Got the app up and running in Firefox Dev Edition. Couldn't really make much sense of the role of the action button. I was looking at the New Message window. Found a few buttons such as Send, Attachment, Options there.
Also, I wanted to learn how to run unit tests on my machine locally. I remember doing it for another gaia bug on firefox dev edition where I would be presented with a list of unit tests and I could choose and execute any number of them. I would get console log as well as immediate results. It would be much faster than waiting for treeherder each time.
(In reply to Kalpesh Krishna from comment #8)
> @azasypkin :- Yeah now things make sense :) . I have made a few changes and
> pushed again. 
> 
> I had an issue with my npm due to which I was unable to setup the test
> environment. Got the app up and running in Firefox Dev Edition. Couldn't
> really make much sense of the role of the action button.

Let me know if you still have issues running Messages app in browser, you can share log or something so that I can take a look. I usually follow steps from the resource I've mentioned in comment 7 and everything works fine. You can also use WebIDE + Simulator [1] if it's easier for you.

> I was looking at the New Message window. Found a few buttons such as Send, Attachment,
> Options there.

In case of Messages app, action button is a _back_ button inside top header in every view/page. It's dynamically added by header component, that is why you don't see it in markup. But you can analyze it with Page Inspector [2] once you run app in the browser or simulator.

> Also, I wanted to learn how to run unit tests on my machine locally. I
> remember doing it for another gaia bug on firefox dev edition where I would
> be presented with a list of unit tests and I could choose and execute any
> number of them. I would get console log as well as immediate results.

So in this bug you're working with Gaia integration tests, not unit tests, the workflow is different here. See [3] for more details. You can also use console.log inside integration tests tests. It's a bit trickier than unit tests as error messages aren't that obvious, but you can come on IRC (#fxos, #gaia-messaging channels) and ping me directly (azasypkin) if you have any difficulties :)

> It would be much faster than waiting for treeherder each time.

Absolutely! I always run tests locally using steps from [3], it significantly speeds up the process :)

[1] http://mdn.io/webide
[2] https://developer.mozilla.org/en-US/docs/Tools/Page_Inspector
[3] https://developer.mozilla.org/en-US/Firefox_OS/Automated_testing/Gaia_integration_tests
@azasypkin :- Were you talking about the browser "BACK" and "FORWARD" buttons? Because I was using them to navigate to and fro in the sms app. Is it because I have made incomplete changes to my repository? A switch to master branch does no good so I suppose I haven't understood what to look for. I did see the inspector. Found a <gaia-header> and this in it.
> <a aria-label="Actions" id="threads-options-button" data-icon="more" data-l10n-id="actionsButton"></a>

I managed to run the tests locally successfully :) I'll try to figure out my mistakes.
okay not, facing this error constantly
https://pastebin.mozilla.org/8847421
can you run "npm install" ?

If this still doesn't work you can try this:

  rm -rf node_modules; make node_modules
Hi Julien,
Facing a similar error even after those steps. 
Node version :- v0.12.7
NPM version :- 2.11.3
(In reply to Kalpesh Krishna from comment #11)
> @azasypkin :- Were you talking about the browser "BACK" and "FORWARD"
> buttons? Because I was using them to navigate to and fro in the sms app. Is
> it because I have made incomplete changes to my repository? A switch to
> master branch does no good so I suppose I haven't understood what to look
> for. I did see the inspector. Found a <gaia-header> and this in it.
> > <a aria-label="Actions" id="threads-options-button" data-icon="more" data-l10n-id="actionsButton"></a>

Hey, you need to use in-app back button only, browser's back and forward doesn't work correctly (yet). I've captured my screen to show what back button I mean and how it looks inside Page inspector: https://www.youtube.com/watch?v=8I1W5yT3Mis . Enjoy! :)

> I managed to run the tests locally successfully :) I'll try to figure out my
> mistakes.

Great!
(In reply to Kalpesh Krishna from comment #14)
> Hi Julien,
> Facing a similar error even after those steps. 
> Node version :- v0.12.7
> NPM version :- 2.11.3

Hmm, setup looks good. What command do you use to run tests?

Also it probably would be quicker if you come on IRC so that we can "debug"/help in real time :)
@azasypkin :- I guess you weren't around on the IRC in #fxos

Can't see the back button you referred to in the video. This is my screen
Running using command 
> firefox-trunk -profile profile-sms --no-remote app://sms.gaiamobile.org

http://imagebin.ca/v/2GrgPpBvGyDg

Also, I tried to run the tests using 
> make test-integration APP=sms

I have updated the pull request. I guess I'm missing a line somewhere. Do let me know what's going wrong
(In reply to Kalpesh Krishna from comment #17)
> @azasypkin :- I guess you weren't around on the IRC in #fxos
> 
> Can't see the back button you referred to in the video. This is my screen
> Running using command 
> > firefox-trunk -profile profile-sms --no-remote app://sms.gaiamobile.org
> 
> http://imagebin.ca/v/2GrgPpBvGyDg

It seems you version of Fx doesn't support web components, either it's too old or the right preference is turned off ("dom.webcomponents.enabled" should be "true" in "about:config").

> 
> Also, I tried to run the tests using 
> > make test-integration APP=sms
> 
> I have updated the pull request. I guess I'm missing a line somewhere. Do
> let me know what's going wrong

I'll try it locally later today and let you know :)
Added some clarifications about switchToShadowRoot at Github.

Please, ask r? whenever you're ready and Treeherder is green :)

Thanks!
Comment on attachment 8663418 [details] [review]
Checking out example code fix

Passed Gij16 :D
Attachment #8663418 - Flags: review?(azasypkin)
Comment on attachment 8663418 [details] [review]
Checking out example code fix

Looks good now! I've just left two minor nits (2 redundant empty lines).

So now you need to (steps 9-11 in [1]):

1) Fix those minor nits;
2) Squash your commits into _one_ (with correct commit message and r=azasypkin);
3) Rebase your PR branch on the _latest_ upstream master;
4) Push your changes to GitHub and wait for the green treeherder (ping me if you see anything failing so that we can determine if it's related to your PR);
5) Add checkin-neeeded keyword to the bug.

Thanks a lot for your contribution!

[1] https://developer.mozilla.org/en-US/docs/Mozilla/Firefox_OS/Developing_Gaia/Submitting_a_Gaia_patch#Manual_patch_submission
Attachment #8663418 - Flags: review?(azasypkin) → review+
https://treeherder.mozilla.org/#/jobs?repo=gaia&revision=fdd469509dd7f3d507c428b6da1fa7eb42f79c98

Got all green, occasional blue. Will do right? @azasypkin
Flags: needinfo?(azasypkin)
Looks good, let's land this!

Thanks!
Assignee: nobody → kalpeshk2011
Status: NEW → ASSIGNED
Flags: needinfo?(azasypkin)
Keywords: checkin-needed
@azasypkin :- Finally :) It was fun working on this bug. Could I do another bug/mini project under your guidance?
(In reply to Kalpesh Krishna from comment #24)
> @azasypkin :- Finally :) It was fun working on this bug.

My pleasure :)

> Could I do another bug/mini project under your guidance?

Definitely! You can use following query to find mentored and not-yet-assigned Gaia:SMS bugs, not sure if all of them are actionable right now, but you can pick one you like most and ask for guidance on the bug:

https://bugzilla.mozilla.org/buglist.cgi?list_id=12575706&o2=isnotempty&j17=OR&f10=OP&f19=CP&f1=OP&o3=equals&f8=CP&f0=OP&v3=nobody%40mozilla.org&f18=CP&f9=CP&query_format=advanced&f3=assigned_to&f2=bug_mentor&f11=OP&bug_status=NEW&component=Gaia%3A%3ASMS&product=Firefox%20OS

Hope to see you working on one of these :)

Thanks!
Landed, master: https://github.com/mozilla-b2g/gaia/commit/c7cf2abd0ebb83ef238b3a3f150d49300a2ee7d7
Status: ASSIGNED → RESOLVED
Closed: 4 years ago
Resolution: --- → FIXED
Thank you :)
You need to log in before you can comment on or make changes to this bug.