1339527 - Button to edit and reply does not work in Outlook Web Access (OWA)

Status: RESOLVED FIXED

(Web Compatibility :: Site Reports, defect)

Description

[D]

User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.12; rv:51.0) Gecko/20100101 Firefox/51.0
Build ID: 20170125094131

Steps to reproduce:

Logged into Microsoft Office account. Opened email with Word document file attachment. Clicked on the file to preview. Preview window opens. At the top of the preview pane there is a button to "Edit and Reply". 


Actual results:

Nothing happens. Button is dead; does not highlight or turn into a glove icon and clicking does nothing. Have replicated the issue across multiple different profiles and operating systems. Chrome and Safari do not experience this issue. Have replicated the issue on Nightly build 54.0a1


Expected results:

Button should have allowed edits to the document and reply to the email. Other two buttons at the top "Download" and "Hide email" are working properly.

Comment 1

[D]

*Nightly build 20170214030231 version 54.0a1

Comment 2

[Loic]

Masayuki, are you able to reproduce the issue of the user in OWA?

Comment 3

[Masayuki Nakano [:masayuki] (he/him)(JST, +0900)]

I cannot reproduce this bug in outlook.live.com and I don't have any specific OWA account for enterprise users. I guess that this is a bug of specific (perhaps, old) version's issue.

Comment 4

[Andrew Overholt [:overholt]]

We have a number of reports about issues with specific OWA versions but without access to them it's very difficult to fix. Do you think there's any chance we could get an account on your system?

Comment 5

[D]

(In reply to Andrew Overholt [:overholt] from comment #4)
> We have a number of reports about issues with specific OWA versions but
> without access to them it's very difficult to fix. Do you think there's any
> chance we could get an account on your system?

Unfortunately I can't issue accounts on our system. I've also verified this issue on two separate Office 365 accounts that I have access to.

Comment 6

[Andrew Overholt [:overholt]]

(In reply to D from comment #5)
> (In reply to Andrew Overholt [:overholt] from comment #4)
> > We have a number of reports about issues with specific OWA versions but
> > without access to them it's very difficult to fix. Do you think there's any
> > chance we could get an account on your system?
> 
> Unfortunately I can't issue accounts on our system.

I figured; thanks anyway.

> I've also verified this
> issue on two separate Office 365 accounts that I have access to.

Oh, that's interesting. Masayuki, is that different than the outlook.live.com testing you reference in comment 3?

Comment 7

[Masayuki Nakano [:masayuki] (he/him)(JST, +0900)]

Oops, sorry. I misunderstood how to reproduce this. I reproduced this in outlook.live.com too. The "Edit and reply" button is disabled.

Steps I tested:
1. Create a simple Word file locally.
2. Attach the file to new email in Thunderbird.
3. Send it to outlook's account.
4. Open the received mail which was sent at #3.
5. Click the icon of attached Word file in the email.
6. Try to click "Edit and reply" positioned above Word file preview pane (center of the bar).

As I investigated with Inspector, the button is a <button> element whose classes are "_ad_b1 ms-font-weight-regular ms-font-m o365button" and height is 40px. Additionally, next element is a <div> element whose classes are "_ad_c1 _ad_d1" and margin-top is -40px. So, the button is completely overlapped with the div element.

On the other hand, according to its behavior on Chrome, the <button> element should be a child of the <div>. So, looks like that at creating the DOM tree with JS, outlook failed something only on Firefox. This could be a bug of outlook.

Comment 8

[Masayuki Nakano [:masayuki] (he/him)(JST, +0900)]

FYI: The <div> element next to the <button> element represents the bar above Word file preview pane. So, the button is under (in z-index axis) the header bar.

Comment 9

[Hsin-Yi Tsai (she/her) [:hsinyi]]

Hi Mike, according to comment 7, is this something your team could help investigate?

Comment 10

[Mike Taylor [:miketaylr]]

Yep! Dennis, can you take a look at Comment #7 when you have some spare cycles?

Comment 11

[Dennis Schubert [:denschub]]

So, yeah, this is a bit weird. I can conform the behavior mentioned here, I also confirmed that it works in Edge, IE, Safari and Chrome.

The "Edit and reply" button is technically completely behind the div containing the download and close buttons. In no browser the reply button is in the same div, so this is not an issue in generating the DOM, neither from our side nor Outlooks fault. For some reason, all browsers render the label above overlapping elements, which we also do (the label should, in theory, be hidden behind the div like the rest of the button). However, in all browsers except for Firefox, it is actually possible to hover and click the label "through" the div.

Although I will file a Gecko bug to mimic the other's behaviors, but this sounds like something really tricky and maybe controversial. That's why I've set this to contactready, I think we should reach out to Microsoft and tell them about this problem. Here, it could be as simple as adding `position: relative;` to the "Edit and reply" button, but nesting the button inside the div would maybe offer the cleaner solution, although I don't know if that's possible on their side.

Comment 12

[D]

For a while the "edit and reply" button disappeared, but then it reappeared this week. I checked and it now functions properly. I don't know what happened to fix the bug, but it seems to be resolved.

Comment 13

[Loic]

MS has probably fixed it on its side.

Comment 14

[Dennis Schubert [:denschub]]

I can confirm it is working now, so let's close this! :) Thanks everyone.