On Jul 10, 2013, at 7:33 PM, Sam Tobin-Hochstadt wrote:

> On Wed, Jul 10, 2013 at 10:12 PM, Allen Wirfs-Brock
> <allen at wirfs-brock.com> wrote:
>> 
> 
>> Finally, are there races between an async script block that define modules and subsequent html elements  with id attributes.  If such a module uses a free global reference to access the DOM node with the matching id won't the occurrence of the compile time error depend upon whether or not the the async script loader gets around to compiler the the script before the html parser gets to the element with the id?
> 
> There are certainly races here, just the way that:
> 
>    <script async>
>    x
>    </script>
> 
> races with such dynamic DOM insertions.
> 

yes, but sometime like:

<script async>
   function getNode1() {
      return node1   /
   }
   function getNode2() {
     return node2
   }
</script>
<div id='node1' />
<div id='node2' />

never produces an error (note no calls, but in practice I assume it would be structured such that any calls to either of the functions would only occurs after the async script load was known to have completed).

But if you try to modularize the code like:

<script async>
module "mod" {
   export function getNode1() {
      return node1
   }
   export function getNode2() {
     return node2
   }
}
</script>
<div id='node1' />
<div id='node2' />

then it may randomly work or fail with an error depending upon who wins the race.  What seems like it should be a safe refactoring instead produces non-deterministic intermittent errors. 

allen


-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://mail.mozilla.org/pipermail/es-discuss/attachments/20130710/868225b3/attachment.html>

On Jul 10, 2013, at 7:33 PM, Sam Tobin-Hochstadt wrote:

> There are certainly races here, just the way that:
> 
> ```html
> <script async>
> x
> </script>
> ```
> 
> races with such dynamic DOM insertions.
> 

yes, but sometime like:

```html
<script async>
   function getNode1() {
      return node1   /
   }
   function getNode2() {
     return node2
   }
</script>
<div id='node1' />
<div id='node2' />
```

never produces an error (note no calls, but in practice I assume it would be structured such that any calls to either of the functions would only occurs after the async script load was known to have completed).

But if you try to modularize the code like:

```html
<script async>
module "mod" {
   export function getNode1() {
      return node1
   }
   export function getNode2() {
     return node2
   }
}
</script>
<div id='node1' />
<div id='node2' />
```

then it may randomly work or fail with an error depending upon who wins the race.  What seems like it should be a safe refactoring instead produces non-deterministic intermittent errors.