benzap / flyer.js Goto Github PK

View Code? Open in Web Editor NEW

222.0 222.0 12.0 659 KB

Broadcast Messaging Library that works between iFrames, Frames, and Windows

License: Apache License 2.0

Clojure 68.70% HTML 31.30%

clojurescript javascript legacy messaging

flyer.js's People

Contributors

Stargazers

Watchers

Forkers

alvarlaigna davgit da1nonly aydev izonder yashilanka 925800521 moon4dreams chrismoulton siafaalvin waifei lhongjum

flyer.js's Issues

IE Bug when re-opening the same external windows

opening external windows, closing them, and re-opening them causes flyer.js to break. Going to try and look into the root cause of this.

getting Uncaught DOMException

Hi,

I am getting these errors:

Uncaught DOMException (Chrome), Permission denied to access property "flyer_WindowReferences" (Firefox), Blocked a frame with origin... (Safari)

Markup hosted on Domain A:

<!DOCTYPE html>
<html>
    <head lang="en">
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="description" content="">
        <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no" />
        <title></title>

        <script>
            window.onload = function () {
                flyer.subscribe({
                    channel: "test",
                    topic: "some.topic",
                    callback: function () {
                        console.log("event received!!!");
                    }
                });
            };
        </script>

        <script src="flyer.js"></script>

    </head>
    <body>
        <iframe src="http://some.other.host.com:80/flyer_inside.html"></iframe>
    </body>
</html>

Markup hosted on Domain B (http://some.other.host.com:80/flyer_inside.html):

<!DOCTYPE html>
<html>
    <head lang="en">
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="description" content="">
        <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no" />
        <title></title>

        <script>
            var clickHandler = function() {
                flyer.broadcast({
                    channel: "test",
                    topic: "some.topic",
                    data: {}
                });
                console.log("flyer event broadcast!");
            };
        </script>
        <script src="flyer.js"></script>

    </head>
    <body>
        <button onclick="clickHandler()">click here to broadcast flyer event</button>
    </body>
</html>

Error seems to come from line 28699 in flyer.js, just setting or__3638__auto__ to undefined seems to hotfix the problem.

BR, Matthias

Reduce bundle size

Hey! I just stumbled over flyer.js because a documentation service I’m working on picked up the latest release: https://cljdoc.xyz/d/flyer/flyer/1.1.1

It seems like a cool project and since you’re targeting JS as well there’s probably some interesting optimizations to reduce the bundle size. I previously tried some similar minification — waaay less code admittedly — but I learned a few things that might be interesting for you as well:

str brings in a lot of stuff. In the linked example using str instead of goog/buildString adds 88K to the :advanced build. (Note that clj->js uses str under the hood so YMMV.)
If I remember correctly case is significantly leaner than cond — obviously not the same thing though so can't always replace cond.

I hope this is useful to you or at the very least interesting! 🙂 Cheers!

target: functionality isn't working

Leaving this here for when I have time

'target' parameter isn't working for some subscriptions

maximum connection exceeded

I just got this error. Any clue on this one?

What kind of things people would like to see in a demo?

This is an open question,

I'm wondering if anyone would like specific use-cases for this library? I'm going to be developing a demo, outlining some of the things that could be done.

It should lead to some more squashed bugs!

Error when opening new tab via link onto a page with flyer.js

Steps to Reproduce

Create 2 html Pages:

page_with_flyer.html

<script src="flyer.min.js"></script>

page_with_link.html

<a href="page_with_flyer.html" target="_blank">

Open page_with_link.html and click on the link

->
On the newly opened tab, the Browser throws an Exception (tested with firefox and chrome):
Error: Permission denied to access property "flyer_WindowReferences"

This now prevents other javascript to be executed (in a minified file of all javascript on the page)

I tried adding try/catches into the storage.cljs file, which makes it not BREAK the whole javascript, but flyer.js does not work afterwards, when opening via a link.

This is what i tried:

(defn init-window-refs 
  "Initializes our window references"
  []
  (try
      (when (nil? (get-window-refs))
          (aset storage window-list-key (set nil)))
      (catch :default e
            (console.log e)
            nil)))

(defn get-window-refs 
  "Returns the window references, or an empty set"
  []
  (try
    (or
       (aget storage window-list-key)
       nil)
    (catch :default e
      (console.log e)
      nil)))


(defn insert-window-ref! [window]
  (init-window-refs)
  (try
      (aset storage window-list-key
              (conj (get-window-refs) window))
      (catch :default e
            (console.log e)
            nil)))

(defn remove-window-ref! [window]
  (try
        (aset storage window-list-key
                (disj (get-window-refs) window))
        (catch :default e
              (console.log e)
              nil

benzap / flyer.js Goto Github PK

flyer.js's People

Contributors

Stargazers

Watchers

Forkers

flyer.js's Issues

IE Bug when re-opening the same external windows

getting Uncaught DOMException

Reduce bundle size

target: functionality isn't working

maximum connection exceeded

What kind of things people would like to see in a demo?

Error when opening new tab via link onto a page with flyer.js

Recommend Projects

React

Vue.js

Typescript

TensorFlow

Django

Laravel

D3

Recommend Topics

javascript

web

server

Machine learning

Visualization

Game

Recommend Org

Facebook

Microsoft

Google

Alibaba

D3

Tencent