React-based site - This page is having a problem loading

Fixed Issue #7150549

Details

Author
Andreas W.
Created
Apr 8, 2016
Privacy
This issue is public.
Found in
  • Microsoft Edge
Reports
Reported by 1 person

Sign in to watch or report this issue.

Steps to reproduce

This was previously posted on https://github.com/Microsoft/ChakraCore/issues/676 but they referred me here since the crashing process is edgehtml and not the javascript engine as I suspected.

We have two websites based on React js. They both fail with "This page is having a problem loading". I found a crash event log and related log files but there is little information that I can find to go on.
I’ve compiled attached archive with a static html page (sendsms, saved from Chrome) and the log files.
The site this page is from has been tested and works in Chrome, Firefox, IE11 and a range of mobile browsers.
I suspect that our javascript (maybe combined with React js) is triggering some error condition in Edge, but I am at a loss how to debug this since the browser crashes.
I would appreciate if anyone could take a look at this bug and give me some pointers.

Attachments

2 attachments

Comments and activity

  • Microsoft Edge Team

    Changed Assigned To to “Christian F.”

    Changed Assigned To from “Christian F.” to “Brad E.”

  • Hello,

    This appears to be related to the bundle.js file you have included with the project based on my testing so far. There seem to be about 20-25 different javascript libraries included within this file.

    At the moment that is all I know, but will update once I have more details for you. I appreciate your patience while I look into this item of feedback.

    All the best,
    The MS Edge Team

  • We narrowed the issue down a shimmer css animation effect that we use for components while they load data from the backend. We are now investigating how we can tweak the shimmer effect to not trigger this error in MS Edge. The notLoaded css class is in the archive in msedge\sendsms_files\businesscare.css starting from line 538.

  • We found that the error is caused by a calc expression in a CSS animation keyframe. This bug is already logged here:
    https://connect.microsoft.com/IE/feedback/details/733978/css-animation-dont-accept-calc-as-property-values

  • Microsoft Edge Team

    Changed Status to “Fixed”

  • Thanks for your patience on the matter.

    I have now tested this repro you provided on a variety of different builds and will be attaching a screenshot of my results.  The first Win 10 build number is highlighted with a box, the others are not highlighted but in the same place.

    This does seem to have been fixed in later builds of Edge, I hosted the repro here for you to test:
    http://ec2-52-11-5-162.us-west-2.compute.amazonaws.com/repro/7150549/

    You an also use the same later builds for testing by going here:

    https://developer.microsoft.com/en-us/microsoft-edge/tools/vms/windows/

    Hope this helps.

You need to sign in to your Microsoft account to add a comment.

Sign in