Comments

martin107 created an issue. See original summary.

martin107’s picture

Just making notes to gauge the urgency of fixing this

https://www.w3counter.com/globalstats.php

Suggests IE11 has 3.16% global usage.

In my experience w3counter has a bias, other global stats produce different results, but all within a margin
suggesting IE11 is on its way out.

Drupal8 at time of writing supports IE11!

https://www.drupal.org/docs/8/system-requirements/browser-requirements

martin107’s picture

Title: Lack of support for IE11 breaks (default) AJAX links » [Regression] Lack of support for IE11 breaks (default) AJAX links
martin107’s picture

Assigned: Unassigned » martin107

As reported by Matroskeen, here

https://www.drupal.org/project/flag/issues/2764709#comment-12502502

Syntax error is in this line:

attach: context => {

and in this construction: =>

Please see https://stackoverflow.com/a/24900924/6314031.

martin107’s picture

Assigned: martin107 » Unassigned
Status: Active » Needs review
StatusFileSize
new1.09 KB

looking at the error message in #4 and in core for the standard way to "attach" in es6 code... I see I was doing it wrong...

./core/modules/editor/js/editor.es6.js

  /**
   * Enables editors on text_format elements.
   *
   * @type {Drupal~behavior}
   *
   * @prop {Drupal~behaviorAttach} attach
   *   Attaches an editor to an input element.
   * @prop {Drupal~behaviorDetach} detach
   *   Detaches an editor from an input element.
   */
  Drupal.behaviors.editor = {
    attach(context, settings) {
      // If there are no editor settings, there are no editors to enable.
      if (!settings.editor) {
        return;
      }

I note that flag-admin.js follows the old way of doing it ... but uses strict mode.

I am not a IE11 user so I hope this fixes the problem?

matroskeen’s picture

Status: Needs review » Needs work

Now IE expects ":" in this line:
attach(context) {

Could we use default Drupal.behaviors definition there? https://www.drupal.org/docs/8/api/javascript-api/javascript-api-overview

Also, seems that we have to have a fallback for IE11 if we would like to use ECMAScript2016 specific code. It's a little sad, but we have to support this browser until the official "end of life".

martin107’s picture

Assigned: Unassigned » martin107

transpiling is supposed to remove all these incompatibilities. --- presets can describe which browsers we target.
... here is a code snippet.

"presets": [
    "es2015",
    "react",
    "next/babel",
    "stage-0",
    [ "env", {
      "targets": {
        "safari": 10,
        "ie": 11
      },

BUT in this module the js is only a small part of the project... so overall I think we gain most advantage by keeping in lock step with D8 core.... in that vein we inherit all the inconsistencies of the larger project. I will look at this further tonight.

martin107’s picture

Title: [Regression] Lack of support for IE11 breaks (default) AJAX links » [Regression] default AJAX links break in IE11
Assigned: martin107 » Unassigned
Status: Needs work » Needs review
StatusFileSize
new251.96 KB

There are several takes on the fix for this... all roads lead back to "I was an idiot"

Doh -- Drupal8 core does have build targets... it builds for "ie >= 9"
Doh -- The fix - We should be in lock step with core.
Doh -- now we implement "transform-es2015-arrow-functions"

So the fix: put package.json in lock step with core and retranspile.

[Me: hang head in shame and eats donuts ]

socketwench’s picture

Yeah, I still can't compile this. At this point I'm going to assume it's me because even after an hour of research, I *still* can't figure out how to set this up or what steps to do.

matroskeen’s picture

StatusFileSize
new10.27 KB

Looks like the original issue is fixed with the last patch.

But I have another one when clicking on "Flag" ajax-link. Please see attached screenshot. The message is "Object doesn't support property or method 'values'". (Can be reproduced in IE11 only)

Probably, this issue is not related to flag module as I couldn't find any mentions of "values" in the js code.

I'm going to dive into this issue but maybe someone could help!

martin107’s picture

Related issues: +#2949035: Document javascript transpiling stratergy
StatusFileSize
new114.64 KB
new261.03 KB

Regarding #9

While I have never met socketwench, I have seen the way she forms arguments in the issue queue, and have seen her contribution to the module.... in short that is a major failure on my part. I am spinning off an issue "write a welcoming developer guide for coders with far less experience"

It may also be my fault in another way ... so I am going to iron out a quirk which potentially stops others from building the javascript. Following on my "we should keep in lock step with core" track ... I note that core does not commit package-lock.json... it will be automatically populated as part of the "install the programs for transpiling" of any good guide.

@Matroskeen .. I will have a look at #10 tonight.

matroskeen’s picture

Status: Needs review » Reviewed & tested by the community

@martin107,

Never mind, I had this one #2948623: Object.values() function is not supported on older browsers.

I think we can mark this issue as fixed.

martin107’s picture

I have just reread #11 I meant only to imply that socketwench has loads of experience and I want to provide a on ramp for all developers ... that did not jump of the page due to my clumsy word salad... sorry

socketwench’s picture

No worries. ^_^

I think I figured it out:

ded7c8bda1d0:/module$ yarn install
yarn install v1.3.2
[1/4] Resolving packages...
[2/4] Fetching packages...
info fsevents@1.1.2: The platform "linux" is incompatible with this module.
info "fsevents@1.1.2" is an optional dependency and failed compatibility check. Excluding it from installation.
[3/4] Linking dependencies...
[4/4] Building fresh packages...
success Saved lockfile.
Done in 6.62s.
ded7c8bda1d0:/module$ yarn run build:js
yarn run v1.3.2
$ node ./scripts/js/babel-es6-build.js
[03:36:57] './js/flag-action_link_flash.es6.js' is being processed.
[03:36:57] './js/flag-action_link_flash.es6.js' is finished.
Done in 0.76s.

The problem seems to be that there was a lot of garbage from me flailing about. There were three separate permission issues and a symlink I had forgotten about. Once I took a look at it tonight it started to click.

  • martin107 authored 7bf4130 on 8.x-4.x
    Issue #2948434 by martin107, Matroskeen: Fix regression, default AJAX...
socketwench’s picture

Status: Reviewed & tested by the community » Fixed

Thanks everyone!

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.