| <!DOCTYPE html> |
| <html> |
| <head> |
| <title>image-onerror</title> |
| <style> |
| #result { |
| width: 100px; |
| height:100px; |
| background-color:#0047AB; |
| } |
| </style> |
| </head> |
| <body> |
| |
| <div id="result"></div> |
| |
| <script> |
| |
| function expect(condition, message) { |
| if (!condition) { |
| document.querySelector('#result').style.display = 'none'; |
| const fullMessage = `failed expectation at: |
| ${new Error().stack} |
| ${typeof message === 'undefined' ? '' : 'with message: ' + message}`; |
| console.error(fullMessage); |
| } |
| } |
| |
| if (window.testRunner) { |
| window.testRunner.waitUntilDone(); |
| } |
| |
| const image = new Image(); |
| |
| let imageOnErrorWasCalled = false; |
| let imageErrorEventHandlerCalled = false; |
| |
| function endTestIfAllErrorHandlersCalled() { |
| if (imageOnErrorWasCalled && imageErrorEventHandlerCalled) { |
| // Success! |
| if (window.testRunner) { |
| window.testRunner.notifyDone(); |
| } |
| } |
| } |
| |
| image.onerror = (errorEvent) => { |
| expect(errorEvent.type === 'error', errorEvent.type); |
| imageOnErrorWasCalled = true; |
| endTestIfAllErrorHandlersCalled(); |
| }; |
| |
| image.addEventListener('error', (errorEvent) => { |
| expect(errorEvent.type === 'error', errorEvent.type); |
| imageErrorEventHandlerCalled = true; |
| endTestIfAllErrorHandlersCalled(); |
| }); |
| |
| image.src = 'bogusscheme://invalidurl'; |
| |
| setTimeout(() => { |
| // If we hit this timeout we have failed because we expect the previous event |
| // handlers to have both fired before we get here. |
| expect(false); |
| |
| // However, if we do get here, the subsequent expect statements can help |
| // identify which of the error handlers failed to be called. |
| expect(imageOnErrorWasCalled); |
| expect(imageErrorEventHandlerCalled); |
| |
| if (window.testRunner) { |
| window.testRunner.notifyDone(); |
| } |
| }, 1000); |
| |
| </script> |
| |
| </body> |
| </html> |
