Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

taobao.com: Menus and links are missing at the top right of the page [msft ref# 252437] #311

Closed
TheWebJustWorks opened this issue Sep 5, 2014 · 3 comments

Comments

@TheWebJustWorks
Copy link

URL: taobao.com
Browser / Version: IE 11.0/ Firefox / Chrome
Operating System: Windows
Problem type: Looks like the website has a bug.
Site owner: No

Steps to Reproduce
This issue can only be observed in desktop IE when using a prototype built that exposes Touch Events. However, you typically should be able to see these issues in Chrome by enabling Touch Events in the developer tools or using a mouse in Chrome on a device that also has a touchscreen.

  1. Navigate to URL: http://www.taobao.com/market/global/index_new.php
  2. Verify that menus and links are missing at the top right of the page.

Actual:
Menus and links are missing at the top right of the page.

Expected Result:
Menus and links should be displayed properly.

Diagnosis feedback:
Internet Explorer for Windows Phone 8.1 Update now supports both Pointer Events and Touch Events. However, Internet Explorer does not yet support Touch Events on Windows (desktops, laptops, tablets, hybrids, etc). Web developers have asked us to also bring Touch Events to Internet Explorer on Windows, and we want to do that. However, we’ve identified a particular coding pattern that causes compatibility issues that prevent us from following through on this. Similarly, other desktop browsers have also seen these issues and would like to work to resolve them. This site was identified as one of several sites that may have compatibility issues due to this coding pattern. We’d like your help in updating this code so that Touch Events can be brought to all browsers on mobile and desktop.

Code Details:
The following coding pattern (or something very similar) was observed:

if('touchstart' in document.body) {
elm.addEventListener('touchstart',fn1);
}else{
elm.addEventListener('mousedown', fn2); //only registered on browsers/devices without Touch Events
}

This pattern assumes that the Touch Event API is only exposed on devices that are touch-only. As a result, devices that expose the Touch Event API but have a mouse attached may not function correctly since the mouse event handlers are not registered. Changing this pattern to use both Touch and Mouse Event handlers together will resolve this issue:

elm.addEventListener('touchstart',fn1);
elm.addEventListener('mousedown', fn2);
Alternatively, you might consider using Pointer Events to share code across event handlers:
if (window.PointerEvent) {
elm.addEventListener('pointerdown', fn);
} else {
//Fallback support for browsers that do not yet support Pointer Events
elm.addEventListener('touchstart',fn);
elm.addEventListener('mousedown',fn);

@TheWebJustWorks TheWebJustWorks changed the title taobao.com - taobao.com:Major Page Functionality :Menus and links are missing at the top right of the page [msft ref# 252437] taobao.com:Major Page Functionality :Menus and links are missing at the top right of the page [msft ref# 252437] Sep 5, 2014
@TheWebJustWorks TheWebJustWorks changed the title taobao.com:Major Page Functionality :Menus and links are missing at the top right of the page [msft ref# 252437] taobao.com: Menus and links are missing at the top right of the page [msft ref# 252437] Sep 5, 2014
@TheWebJustWorks
Copy link
Author

For more detail on 'Mouse touch and pointer events' see the latest blog by @jacobrossi http://blogs.msdn.com/b/ie/archive/2014/09/05/making-the-web-just-work-with-any-input.aspx

@hallvors
Copy link

hallvors commented Oct 1, 2015

Enabling touch events in Desktop Firefox doesn't break the page (not sure if that means the problem is gone or Firefox just evades it by beging slightly different..)

@karlcow
Copy link
Member

karlcow commented May 9, 2016

Closing. Not sure what is the status for @TheWebJustWorks. There are a couple of bugs marked with ie which are in limbo from the Microsoft team. Not sure how to handle them?

@karlcow karlcow added this to the invalid milestone Oct 30, 2017
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

5 participants
@hallvors @karlcow @TheWebJustWorks @webcompat-bot and others