Make formly work on IE8

[koenweyn]

Sadly I have to support IE8 for our project, so I spent the day trying to get formly to work.
I pulled it off by adding the necessary custom tags, and using a different method of locating tags.
I could not run the unit tests in IE8, because chai doesn't support it, but I can confirm that my formly form now works.

[kentcdodds]

Looks good. Thanks for your work on this! The one thing that I'll say is that you'll definitely need polyfills for things like map, and forEach, etc. But if you say that this is working for you in IE8, then that's awesome. I'll get this merged as soon as I'm able!

[kentcdodds]

Missed this. We can't do this. This would be a breaking change. Also, we want to default to ng-form because forms cannot be nested, and that's a pretty big use case for angular-formly.

[koenweyn]

Ok, would you be fine with it to only do that when running in IE8?
Or do a <div ng-form> when running in IE8?
IE8 can't cope with ng-form and directive replace because for some reason custom tags in IE8 look like having multiple root nodes.

[kentcdodds]

Definitely don't want to have it change this kind of behavior in different browsers. That could lead to some really odd bugs. Why couldn't we simply add 'ng-form' to the list of custom elements in the formlyCustomTags file you've made?

[koenweyn]

Sadly that doesn't work, even when you add ng-form to the custom tags. But I'll try to find another way. Stay tuned! ;-)

[koenweyn]

@kentcdodds Would you be fine with this change:

        var formTag = (attrs.rootEl || 'ng-form').split(' ');
        var formEl = formTag[0];
        var formAtt = formTag.slice(1).join(' ');

        return `
          <${formEl} ${formAtt} class="formly">
          </${formEl}>
        `;

That way, the default is still 'ng-form', and users can specify things like root-el="form" or root-el="div ng-form".

[kentcdodds]

I would rather not overload the rootEl attribute to do this. I think the current implementation allows you to deal with the issue just fine. If you want to use an ng-form but you don't want it to be the root element, then you can do:

<div ng-form>
  <formly-form root-el="div">
  </formly-form>
</div>

[koenweyn]

You're absolutely right, I'll close this PR and will open a new one with these lines reverted.

[koenweyn]

I did have to add quite a few polyfills (especially for api-check), but I'm guessing you would want to keep those out of both api-check and angular-formly.

[kentcdodds]

@koenweyn, you've guessed right :-)

[kentcdodds]

@koenweyn, seriously, thank you for working on this. I really appreciate the help! I hope it's worth it for you!

[koenweyn]

@kentcdodds, I'm just really keen on successfully completing my first ever github pull request ;-)
(and I really got inspired to start contributing by Aaron Frost's talk on ng-nl last month)

[kentcdodds]

Me too! Were you there?! Did I meet you?

[kentcdodds]

Thanks for being a good bridge crosser/builder! :D

[koenweyn]

I was there, but we didn't meet, I'll come and say hi next time.

[kentcdodds]

Definitely :D

[kentcdodds]

Hey @koenweyn, I'm writing a blogpost that references this PR. Do you mind if I reference you in it? https://medium.com/@kentcdodds/78281ea47455

[koenweyn]

Sure, no problem Koen