Javascript error - Githubissues

ktb92677 commented 5 years ago

Hi all! Probable a silly error here but I am getting this error right now with Broadway:

"Player.js:43 Uncaught TypeError: Cannot read property 'nowValue' of undefined"

Here's my js code:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">

        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
        <script type="text/javascript" src="Player.js"></script>
        <script type="text/javascript" src="Decoder.js"></script>
        <script type="text/javascript" src="YUVCanvas.js"></script>
        <script type="text/javascript">
            $(function() {
                window.WebSocket = window.WebSocket || window.MozWebSocket;
                var websocket = new WebSocket('ws://127.0.0.1:9000',
                                              'dumb-increment-protocol');

                const player = new Player({
                    useWorker: true,
                    workerFile: "Decoder.js"
                });

                //document.body.appendChild(player.canvas);

                websocket.onopen = function () {
                    $('h1').css('color', 'green');
                };
                websocket.onerror = function () {
                    $('h1').css('color', 'red');
                };

                websocket.binaryType = 'arraybuffer';
                 websocket.addEventListener('message',function(event) {
                      player.decode(new Uint8Array(event.data));
                      console.log("WebSocket message received:", event);
                 });

                $('button').click(function(e) {
                    e.preventDefault();
                    websocket.send($('input').val());
                    $('input').val('');
                });
            });
        </script>
        </head>
    <body>
        <h1>WebSockets test</h1>
        <form>
            <input type="text" />
            <button>Send</button>
        </form>
        <div></div>
    </body>
</html>

Joshua-R-Carr commented 5 years ago

Is the error breaking your code somehow, or are you just concerned about it? From what I can tell, it comes from the Player.js code itself as opposed to anything in your js:

var nowValue = Decoder.nowValue;

  var Player = function(parOptions){
    var self = this;
    this._config = parOptions || {};

    this.render = true;
    if (this._config.render === false){
      this.render = false;
    };

    this.nowValue = nowValue;

ktb92677 commented 5 years ago

Yes it is breaking my code. It is saying that player is undefined because of the error. This error is reproducible. I've tried it on several webservers now. How can I fix this error? How is it that no one else is getting this error either?

ktb92677 commented 5 years ago

Okay after harassing many "experts" in javascript I figured out where I went wrong. I don't really understand why this isn't well documented anywhere. I am guessing that if I had problems just getting a basic include to work for this library I am in for a whole hell of a time finishing the implementation. Why can't there be a simpler sample/demo on this git? I'd like to point out that the demos on this git do NOT work on a vanilla Apache server (or any other webserver for that matter). The other example that is linked written with PromiseLand and nodejs also seems extremely out of date. Javascript supports async now-a-days so I am not sure what the purpose of promiseland is. Furthermore how could the only working example for this project be written with essentially a programming language of its own (promiseland) that no one uses.

So here was the problem (for anyone else who will inevitably come across this undocumented issue): my includes were in the wrong order. Here is the proper order:

<script type="text/javascript" src="Decoder.js"></script>
<script type="text/javascript" src="YUVCanvas.js"></script>
<script type="text/javascript" src="Player.js"></script>

After doing this I received the following error:

wasm streaming compile failed: TypeError: Failed to execute 'compile' on 'WebAssembly': Incorrect response MIME type. Expected 'application/wasm'.

Please note that ANYONE who tries to set this up on a vanilla webserver (like apache or nginx) will receive this issue. Again I am astonished that this isn't at the top of this git page in all caps. To resolve this you have to do the following:

https://github.com/mdn/webassembly-examples/issues/5

I also had to restart my browser and clear all the cache manually for it to take effect.

My only plea is that this repository have a better example and more documentation of basic issues like this.

soliton4 commented 5 years ago

Please make a pr

mbebenita / Broadway

Javascript error #207