I've been anxiously awaiting the release of Safari 11 on OS-X and iOS 11. Now that they're finally here, I can use Safari to record audio data from the microphone -- except that the long-promised support doesn't actually work.
I'm running macOS Sierra 10.12.6 with Safari Version 11.0 (12604.1.38.1.7). The following demos all fail with errors:
https://www.webrtc-experiment.com/RecordRTC/ -- Unhandled Promise Rejection: [object DOMError]
https://www.webrtc-experiment.com/msr/audio-recorder.html -- media error -- TypeError: undefined is not a constructor (evaluating new Recorder(mediaStream))
https://webrtc.github.io/samples/src/content/peerconnection/webaudio-input/ -- Failed to get access to local media. Error: ReferenceError
I've been able to code my own demos that work in FF/Chrome/Edge but capture only "empty" audio in Safari 11 while displaying no errors.
Can anyone out there confirm this behavior? First off, I need to know if I'm alone in seeing WebRTC completely broken in Safari 11.
Next up is Safari 11 in iOS. This is much harder for me to test. It seems like all the demos above are also broken on iOS. Safari 11 on iOS Simulator in XCode doesn't even seem to support WebRTC at all whereas actual Safari 11 on iOS reports to the browser that it's supported but, like desktop, it doesn't actually work.
Does anyone know what in the world is going on? As far as I can tell, the Safari 11 that was just pushed out to iOS 11 and Sierra not only doesn't support audio recording, but MUCH worse, passes the getUserMedia feature detection code implying audio can be captured (but it never actually works).
I'm curious if upgrading to High Sierra fixes anything but I don't want to try because even if it works there, I need access to a broken state to try and come up with some way to work around the busted feature detection.
I need to get a handle on this but it's proving difficult because the only documentation online says that "Safari 11 supports the audio portions of WebRTC" which I cannot replicate anywhere on either my phone or desktop.
Any help or confirmation would be appreciated.
The webaudio-input demo fails due to the lack of an unprefixed AudioContext. Try if
window.AudioContext = window.AudioContext || window.webkitAudioContext;
fixes things
Also see this issue about some hacks required to make things work.
Related
Safari 11 is crashing when i open web inspector. Odd thing is, It works without failing if i don't open console panel. My HTML5 application works well in all other browsers.
There is no memory leaks as it is not going beyond 50MB while taking memory heaps. And no use of console methods.
Is this a known issue in Safari 11?
The only thing I can do to fix this is free up RAM. If I close a few applications and then try it again, it always works. Also after it crashes a few times you will not be able to inspect your device until you quit safari completely and open it again.
Some say it seems to be an hardware issue, happening only when the battery is at 100%.
Have a closer look here:
https://forums.developer.apple.com/thread/92290
Maybe it helps keeping on your flashlight and camera, then establishing a cable connection and starting the web inspector then.
Anyway: This wasn't working for me.
Another Maybe: Connect via network instead of a cable connection.
Things that might be too late by now:
Advice 1: Do not upgrade above 10.x and use Safari 10.x along with iOS 10.x
Advice 2: Put your devices in trash or sell it anyway and start not to use apple anymore. 99% of my upsets lead to issues with iOS and Mac.
I have a metronome app that was working and is published to iTunes. When ios 9 came out, it broke my app. It also breaks on OSX after upgrading to 10.11.2 as well. I download Mac Chrome and the same code works fine. So it is broken in Webkit/Safari.
If I create a bufferSourceNode and then call start on the node, I receive the error 'invalidStateError DOM Exception 11'.
There are issues reported with ios and WebAudio in relating to the touchend / touchstart events. Apparently, Apple changed the API that it required the first event to be a touchend interaction. I'm not sure if this is what is breaking my code. I tried the workaround but to no avail ( WebAudio user-gesture restriction is no longer lifted by touchstart event : https://bugs.webkit.org/show_bug.cgi?id=149367).
Does anyone have any clues or workarounds as to this issue?
Thanks,
bruce
I discovered my problem was an issue in audioContextMonkeyPatch.js that I was using for iPhone.
The start() method takes 3 parameters and I was only passing 1 parameter to the method. iPhone 8 accepted that ok, however when upgrading to iPhone 9, the underlying Safari call failed because of the undefined parameter. I put a check into the shim codes and everything resolved.
Recently I have been considering using Polymer elements in a project I am working on. However, I am unable to see any elements being rendered in the new beta version of safari for OS X 10.10 Yosemite. I completely understand that Yosemite and Safari are currently in the DP phase, but I am curious as to why the new verison of Safari has broken compatibility with Polymer elements (I can confirm Polymer elements work in Mavericks version of Safari).
I was able to open the developer console and spot an error. I am unable to reach the exact error at this time, but I know the error was at patches-mdv.js at line 57, claiming a Read Only error.
I just tested the Polymer Project website on my iPhone with iOS8, having the same results.
Does anyone have an idea on what I could do to fix this issue temporarily until the Polymer-Project team fixes it?
One apparent problem is that the Safari beta has at least one low-level property accessor (specifially HTMLBaseElement.prototype.href) that is misconfigured from the standard.
So, cursory investigation implies this is a bug in Safari, not Polymer.
I'm having a strange problem. I have an ancient microsoft sidewinder version 1 gamepad laying around, And since I'm learning javascript/html5 I thought let's try the gamepad in browser.
I tried it on linux (my laptop, ubuntu 13.04) did:
navigator.webkitGetGamepads()[0] in the console of my chrome browser (version 28.0.1500.71) and the gamepad was detected right away.
Than I tried the same thing on my windows 7 64 bit desktop, running Version 30.0.1599.101 m
did: navigator.webkitGetGamepads()[0] in the console, but no luck here, it keeps telling me undefined. When I go to "my devices" in windows, the gamepad is there.
(https://www.dropbox.com/s/yam4fj5zqiogyjh/gamepad.png)
I have the same problem on my laptop running windows 8, 64 bit.
I have no idea what's wrong, and I have no idea how to fix it. (I hope it's fixable)
Please help
You might want to try the most known gamepad testing scripts first.
Chrome: http://www.html5rocks.com/en/tutorials/doodles/gamepad/gamepad-tester/tester.html
Firefox (28, use Aurora) : http://luser.github.io/gamepadtest/
If your Gamepad is using DirectInput and not XInput you may have some issues with Chrome, but it will work fine with Firefox then. For instance, I had the same problem with the PS4 Gamepad.
The spec is unfinished, but this repository is a great start. Try it:
https://github.com/luser/gamepadtest
It attempts to account for differences in implementations of the unfinished spec, as well as Chrome's prefixed implementation.
I have an HTML5 web page which uses audio via JavaScript. I have a basic version which loads the correct audio file (e.g., ogg vs mp3 etc), and then correctly plays sprites from that file. This basic version has only 1 javascript file, and it works on all OS/browser combinations I've tried, including: OSX (Safari, Chrome, Firefox), iOS 5 and 6 (Safari), Windows 7 (Firefox, Chrome), and Android 4.2 (Firefox).
I now take the code and insert it into the production version. Now, the HTML page loads many other JavaScript files (e.g., jquery, jquery ui, flot). However, all of the audio code is in a single file that is included via
<script src="/foo/bar/sound.js"></script>.
In both cases, the code in sound.js is invoked by the user clicking on a button. On all platform/browser combinations mentioned above, the combined code works EXCEPT on iOS (tested on iOS 5 and 6 on both iPad2 and iPad3). The error I'm getting is
INVALID_STATE_ERR: DOM Exception 11: An attempt was made to use an object that is not, or is no longer, usable.
This occurs on a line that tries to set mySound.currentTime based on the particular sprite needed:
mySound.currentTime = spriteData[currentSound].start;
mySound is my sound object, and the spriteData is correct. Oddly, the same code that fails on real iPads works just fine in the iOSSimulator, regardless of whether I simulate iOS 5 or iOS 6.
How do I go about debugging this situation? I'm at a loss of where to look and what to try. Any suggestions would be appreciated.
Mobile Safari has a developer mode that allows you to attach from Safari on a Mac; see Safari Web Content Guide: Debugging Web Content on iOS.
I'd also try breaking up the expression to see which bit is causing the error, e.g.
var t = spriteData[currentSound].start;
mySound.currentTime = t;
I finally found a solution. On all platforms the following works in the standalone code, but when combined with the rest of the production page, fails on iOS (even iOS 6.1):
audioSprite = document.createElement('audio');
audioSprite.setAttribute("src","/foo/bar/file.xxx");
where xxx is mp4, ogg, wav, or mp3, depending on what the browser can handle.
Changing these two lines -- and keeping everything else the same -- to the following works on iOS on the production page:
audioSprite = new Audio('http://example.com/foo/bar/file.xxx');
I still don't know why the second version works and the first doesn't.