Giter Club home page Giter Club logo

ie8's Introduction

ie8 donate

warning

This is year 2017. IE8 was released in 2009. You should not support IE8 anymore.

Not even transpilers support it. Be sure you actually really need this polyfill, testing your projects via real IE8 and not some IE11 emulator.

FYI this repository is slowly going to die as it should be. If I were you, I wouldn't wait for updates here or waste time for this browser.

in a nutshell

  • addEventListener, removeEventListener, and dispatchEvent for IE8 including custom bubbling events
  • timeStamp, cancelable, bubbles, defaultPrevented, target, currentTarget and relatedTarget properties per each event
  • document.createEvent('Event') standard API with e.initEvent(type, bubbles, cancelable) supported too
  • preventDefault(), stopPropagation(), stopImmediatePropagation() working with both synthetic and real events
  • document.addEventListener('DOMContentLoaded', callback, false) supported
  • textContent, firstElementChild, lastElementChild, previousElementSibling, nextElementSibling, childElementCount
  • document.defaultView, window.getComputedStyle
  • HTMLElement
  • basic support for DOM Ranges mutations

current tests file and live test page

how to include the project

Here a page example

<!DOCTYPE html>
<html>
  <head>
    <title>ie8</title>
    <!--[if IE 8]><script src="ie8.js"></script><![endif]-->
    <script>
    this.addEventListener('load', function(e) {
      alert('Hello Standards');
    });
    </script>
  </head>
</html>

The file can be either the full version or the minified one and could be placed before or after some third parts library accordingly with compatibility.

ie8 in CDN

It is now possible to include this file through cdnjs

<!--[if IE 8]><script
  src="//cdnjs.cloudflare.com/ajax/libs/ie8/0.8.0/ie8.js"
></script><![endif]-->

W3C DOM Level 2

This polyfill normalize the EventTarget interface for every node.

This shim normalizes the DOM Level 2 Event interface too, adding an extra DOM Level 3 .stopImmediatePropagation() as bonus.

W3C DOM Level.next

If you'd like to upgrade even more IE8 capabilities, consider adding dom4 polyfills after ie8.js file.

That would provide enough horse-powers to hazard CustomElement polyfill on top.

known gotchas

Here a humble list of things what won't probably ever be fixed in IE8

  • a standard capturing phase. The logic involved to pause a synthetic or DOM event, capture up, and re-dispatch top-down is probably not worth it the time and the size of the code. Right now if the useCapture flag is used, the event is prepended instead of appended simulating somehow the 99% of the time reason we might opt for the capture phase, being this usually slower too so it's a good practice, in any case, to .stopPropagation() on capture.
  • not supported modern events, DOMContentLoaded a part, such transitionend or similar. As events might exist and might not exist in any browser out there, it does not make sense to fix them here. However, this polyfill provides all needed tools to fix special events through a powerful, custom events compatible, W3C standard API

possible troubleshooting

Some library could do weak features detection and decide the browser is IE8 regardless and threat it like that, some other might assume since this stuff is there and working much more should be possible too.

Well, in 4 years of problems and counting, I have no idea about how many libraries still do work arounds for IE8 but if your libraries are ignoring such browser you might want to add this file regardless and probably find IE8 automagically fixed for all your JS needs.

about

The very first thought I had about this project was: how the hack is possible nobody had gone down this road before?

I am still thinking the same so ... there might be many things this polyfill is not fixing (yet). If you have any specific request please file a feature request (or a bug) in the proper section.

It's about IE8 so I am expecting 23456789065123456789 tickets about problems each day so probably only most relevant will be considered due the amount of time it might take.

Thanks for your contribution and your understanding.

author

twitter/WebReflection
Andrea Giammarchi

ie8's People

Contributors

finesse avatar joonis avatar webreflection avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

ie8's Issues

real ie8 StackOverflow exception

I have got issue with the following example. Then I tried to type anything into input I see error "StackOverflow ".

<div>
                <div>
                    <div>
                        <div>
                            <div>
                                <div>
                                    <div>
                                        <div>
                                            <div>
                                                <div>
                                                    <div>
                                                        <div>
                                                            <input />
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

Tech: webpack+reactjs

Is it known issue? Or may be anyone knows how it can be fixed?

I found error here

function onkeyup(e) {
        var evt = document.createEvent('Event');
        evt.initEvent('input', true, true);
        (e.srcElement || e.fromElement || document).dispatchEvent(evt);
    }

the error is not happening if I skip dispatchEvent handler from dispatch algorithm, but i would like to have fix for it. What do you think about it?

In the dispatch algorithm I see alot of recursion handling. As I understand it may cause errors with markup in the future.

what's the problem?

I just include ie8.js in the page.
and browser console log this:

value failed on object: [object HTMLSelectElement] 对象不支持此操作

what can i do now?

update npm with 2.3

Hi! I noticed that you updated ie8 to 2.3, but npm still only has 2.2.

Btw, I've been using Restyle, document-register-element, and dom4 over the last couple days. Fantastic stuff, thank you very much!

Conflicts with React 0.14

This library causes select.onchange (and possibly other) React events to not fire in IE8. There was a ticket open over there, but they've closed it because they're dropping IE8 support starting with v0.15. I'm not sure if this can be fixed or not on this (ie8.js) end, but it'd be nice 😄

defineProperty issue

We are building Angular JS SPA application and included ie8 shim.

When previewed in emulated IE8 mode(IE11) or in IE8 on XP platform, browser's debugger is complaining about 'Unable to get property 'defineProperty' of undefined or null reference' (a screen shot attached.

error

Getting "Object doesn't support this action"

I think this is due to the that in IE8, defineProperty only accept DOM objects (http://kangax.github.io/compat-table/es5/), although the MSDN link is not as clear...

Basically, in this case, IE8 does not like to call defineProperty with XMLHttpRequest.prototype

The work around I have is to not call defineProperty inside definedProperties:

defineProperties = Object.defineProperties ||
// IE8 implemented defineProperty but not the plural...
function (object, descriptors) {
  for(var key in descriptors) {
    if (hasOwnProperty.call(descriptors, key)) {
      object[key] = descriptors[key].value;
    }
  }
},

HTMLSelectElement defineProperties throw error in IE8

defineProperties(HTMLSelectElement, {
    value: {
      get: function () {
        return this.options[this.selectedIndex].value;
      }
    }
  });

throw error in IE8

it must be?

defineProperties(window.HTMLSelectElement.prototype, {
    value: {
      get: function () {
        return this.options[this.selectedIndex].value;
      }
    }
  });

browserifies require fails on ie8

Hi,

i want to bundle ie8 with some other ie8 fixes. I tried it with browserify, but it seams not to work as expected. I think it's because of the package.json main entry. It is referring to the build/ie8.js file, which expects this to be windows. It would fix the problem If we change packages main to point to src/ie8.js?!

Cannot attach mousemove to document

I have the following code:

document.addEventListener "mousemove", (event = window.event) =>
  alert "move"

However, in IE8, the callback never fires.
This worked in IE >= 9 as well as Chrome and Firefox.

document.createEvent('HTMLEvents') fails

I'm not sure if this is a bug, or a feature, but any calls to document.createEvent() fail for any kind of event except the generic 'Event'. This means that calls that would normally work in IE8 break while using this library. For example:

  • document.createEvent('Event') -> works
  • document.createEvent('HTMLEvents') -> Throws error

It's right there in the code to do this, but is this behaviour intentional?

'defineProperty' is null or not an object

shown in IE 8.0.6001.19587
on this:


defineProperty = Object.defineProperty ||
// just in case ...
function (object, property, descriptor) {
object[property] = descriptor.value;
},


I can't understand...

Can't require() using Browserify

When I try to require() this package in my Browserified project I get a "Error: module "ie8" not found" error. From what I can tell this is because the "main" entry in the package.json file points to a file called ie8.node.js file which doesn't seem to exist after installing the package. I saw that the component.json file pointed to the ie8.max.js file, so I changed package.json to point to that file too and the error went away.

I hate to ask you to support YAPM (yet another package manager) but at least this one doesn't require YAJCF (yet another JSON config file) :-)

Some DOM Event tests fail with this polyfill

Hi Andrea,

incidentally, I created a very similar polyfill [1] with the same goals not long ago. I also created an exhaustive test suite, which passes in all contemporary browsers [2]. I tried running that suite against your polyfill (in IE8) and received quite a lot of errors. Would you mind checking if your impl conforms with the spec and the test suite?

[1] https://github.com/ondras/ie8eventtarget/
[2] https://github.com/ondras/ie8eventtarget/blob/master/tests/SpecRunner.html

If you are not familiar with the Jasmine BDD, let me know and I will provide any assistance to get your tests running.

Publish ie8.max.js

I think it would be better to specific the 'max' build as main, as it makes debugging much easier, and anyone who uses the file via commonjs/npm likely will minify it as part of their own build.

JS-Error in IE8 while calling createEvent with an HTMLEvent

It seems that your lib does not support HTMLEvents.
Do you plan to implement it?

Webpage error details

Message: unsupported HTMLEvents
Line: 433
Char: 32
Code: 0
URI: http://192.168.7.51:8083/.../js/ext/ie8/build/ie8.max.js?1407943532

IE9 doesn't like the Comment and Text nodeValue shims

I'm running aight v2 tests on IE8 and 9 (not pushed yet, but will be soon), and IE9 is failing as a result of the Text#nodeValue shim. I've followed this down into the guts of ie8.js and found that the fallback descriptors are undefined in commonTextContent() for both the Text#nodeValue and Comment#nodeValue, which causes the shimmed property getter and setter to throw an exception when the accessors are called, e.g. Unable to get value of the property 'get': object is null or undefined. My patch just returns early from commonTextContent() when the fallback descriptor is undefined, but this doesn't seem like quite the right thing to do.

I know that ie8.js is intended for IE8, but I need a lot of those shims in aight for IE9 support as well. In this specific case, though, IE9's native Text#nodeValue implementation works. So, should I fork this repo and make some aight-specific patches for IE9 compatibility, or would you prefer to do some light-weight feature detection that ensures it'll just work in IE9?

Feature requests

Hi Andrea!

What do you think about including fixes below into the project:

  • children property fix
  • getElementsByClassName fix via querySelectorAll
  • pageX and pageY properties for events
  • cloneNode fix
  • innerHTML fix for HTML5 elements (see html5shiv.js)
  • insertRule via addRule

Add changelog?

I'm trying to evaluate what I need to be on the lookout for when updating. It would be really helpful to have a changelog to reference.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.