googlearchive / firebase-element

Deprecated. See https://github.com/googlewebcomponents/firebase-element

firebase-element

This element is compatible with Polymer 0.5 and lower only, and will be deprecated.
You can check out a similar 0.8-compatible version of this element at https://github.com/polymerelements/firebase-element

firebase-import

Import files are a new invention, so libraries like firebase do not yet provide them.

firebase-import is an intermediary that provides an import file for the firebase component. firebase-import depends on firebase.

Components that want to use firebase should depend on firebase-element and import firebase-import to be safe from library duplication. Such components need not use Polymer or firebase-element, but we put the import and the element in one package for convenience.

firebase-element's Issues

Dynamic location binding doesn't work

We try to bind the location URL to a variable but this doesn't seems to work. Isn't there a possibility to dynamically change the location URL? Is there a way to trigger the function locationChanged in firebase-login to bind the new location URL?

Thanks in advance!

Uncaught ReferenceError: data is not defined when removing data

Missing this keyword when checking data array length in removeData:

if (this.data instanceof Array) {
  this.data.splice(key, 1);
  if (data.length == 0) {
    this._setData(null);
  }
} else if (this.data) {

Release of fix #11?

Hi Azakus.

When do you plan to release the Fix #11 (Firebase API change)? In the version 0.4.2 you are still using the old API call.

Thanks in advance.
dominik

Add a description in the GitHub repository

having trouble saving to firebase

http://youtu.be/FHyqp_mpq5Q

Is there a reason this isn't published to the Bower registry?

I see private is set to true in bower.json. That's unfortunate.

Can't react to error events

Unless I'm missing something pretty basic it looks like the errorHandler functionality isn't working and the error event doesn't get fired as intended, such as from a security rules policy violation when writing data.

As far as I can tell the problem is that when firebase core library invokes the error handler, this is not bound correctly (it's Window) and it can't find the Polymer fire method for events. It produces TypeError: undefined is not a function referring to this.fire() See the images below.

I put in a quick-n-dirty fix to make it call the fire method correctly, but for some reason I still can't get it to run my event handler even then.

More generally, I'm not sure how I can take certain actions only if a DB operation succeeded and didn't produce an error. There doesn't seem to be anything like a .success() function.

Changes to limitToFirst limitToLast equalTo are not being observed

When limitToFirst, limitToLast, or equalTo change requery is NOT being fired.

Current code:

observe: {
      'ref limit start end': 'requery'
},

Fixed code:

observe: {
      'ref limit start end limitToFirst limitToLast equalTo': 'requery'
},

Error Handling

Great library and great combination of the power of Polymer and Firebase!

I realize its still early days, but adding a way to listen to errors (such as permission denied) would help a lot so we can notify the user and handle flow.

Thanks for your work!

Simple Login Deprecated

https://www.firebase.com/docs/web/guide/user-auth.html

Looks like it should be straightforward to add the auth to the core firebase element.

Error with update and delete new created item

i have done test with https://noteplaces.firebaseio.com/

and i can edit and delete element if they are loaded form firebase but when i create a new one i cannot edit it or delete it unless i reload the page.

it work when i add it with :

var ref = new Firebase('https://noteplaces.firebaseio.com/');
ref.push({
label: "New place",
});

but not with :

this.push('places', {
label: "New place",
});

this is the first error i get when i try to edit after the creation :

Uncaught Error: Firebase.child failed: First argument was an invalid path: "undefined". Paths must be non-empty strings and can't contain ".", "#", "$", "[", or "]" firebase-debug.js:8749

and when i try again i got this one :

Uncaught Error: Firebase.child failed: First argument was an invalid path: "null". Paths must be non-empty strings and can't contain ".", "#", "$", "[", or "]" firebase-debug.js:8749

i think i lost the link with firebase for my item but i cannot see where is it an error from my firebase ?

Write-only annotation attribute to silence read fails

Some endpoints can be write only, for example collecting newsletter emails from public.
It would be nice to mark the corresponding firebase-element as write-only to silence the annoying warning:

FIREBASE WARNING: on() or once() for /emails failed: Error: permission_denied: Client doesn't have permission to access the desired data. 

I'm thinking:

<firebase-element id="emails" write-only
  location="https://myapp.firebaseio.com/emails/">
</firebase-element>

this.fire('login', {user:user}); called twice

In the current master implementation the function _authHandler: function(user) is called twice. The first time through function locationChanged and the second time through function _loginHandler. This will then call on-login twice as well. This seams to be not the proper behavior because my functions will be then called twice as well and I have no chance to react on it in a correct manner.

prototype.registerCallback is not a function

Using firebase-element with Polymer 1.2.1 and getting the following error

Uncaught TypeError: prototype.registerCallback is not a functiondesugar @ polymer-micro.html:74window.Polymer @ polymer-micro.html:58(anonymous function) @ firebase-element.html:132
input-header.html:52 Login was clicked

Please add firebase-list

Should include an element that wraps this one https://github.com/katowulf/Firebase.getAsArray

Then we could avoid the keys hack and do filtering etc. directly in the template repeat :)

Implement transaction functionality

It would be nice to have the Firebase transaction functionality implemented in terms of the Firebase custom elements: https://www.firebase.com/docs/web/guide/saving-data.html#section-transactions

Cannot actually override provider in login method

Taken from the login function definition

Performs a login attempt, using the provider specified via attribute/property, or optionally via provider argument to the login function. Optionally, provider-specific login parameters can be specified via attribute (JSON)/property, or via the params argument to the login function.

I do not see where I am able to pass in the provider, and when specified in the params, it is ignored and the method attempts to login using the original provider.

retrieve user id when user has been created

i can't retrieve user id when user has been created.the result is null.
should i login first and then retrieve the id?

Update Bower dependency for Firebase

The Firebase dependency in the bower.json file should be updated. It is bad practice to use * for the semver as this will break every time Firebase releases a new major version number with breaking changes to API methods. Since Firebase follows proper semver policies, a better approach would be to use 1.x.x. currently, and then 2.x.x once #18 is fixed.

Login button hangs in webapp using firebase login

I don't know if this is the right place to post this issue but since I've used the firebase-login element I'll post it here.

I made a button that toggles between a login state and a logout state and uses the firebase-login element to authenticate using google oauth.

For reference, I did something similar to what was done in this tutorial. The code in this tutorial also exhibits this same strange behavior.

When I press the login button (a paper-item element), its on-tap attribute is set to a login function that just calls the firebase-login element's login method. It then asks me if I want to authenticate, press okay, and then the button toggles to logout. Everything works fine as long as I am in the browser. If I instead add the web app to the homescreen and do this from there, the login button hangs.

What happens is that, when I press the login button, I'm sent to the browser, the authentication happens there, and when I'm done, I press the back button to go back to the app and I find the login button in a pressed state. And it is impossible to "unpress" it.

I don't know if this is from the firebase-login element, from the firebase library, or just a fundamental difference between how web apps work in the browser and if accessed from the homescreen.

Details:

• I am using a samsung s4 running Android Kitkat using the latest release of Chrome for Android
• I use google as the provider
• As far as I can tell, everything works fine in the browser (both laptop and mobile), the problem appears only when I use the web app from the home screen
• I've added the apple-mobile-web-app-capable and mobile-web-app-capable meta tags so I can see the app in fullscreen when accessing it from the homescreen.

Support key reordering

If you update keys via .priority or setWithPriority, the element doesn't pick up on that

Inside a polymer element, clears existing data

I'm not sure if this is actually an issue, or just me misusing the element, but when placed inside another polymer element, as so:

<polymer-element name="test">
    <template>
        <div>
            <firebase-element id="base" data="{{data}}" location="..."></firebase-element>
        </div>
    </template>
    <script>
        Polymer({
        })
    </script>
</polymer-element>

the initial data binding commits a value of null to firebase. I've tried it both with and without specifying a data element in the Polymer function.

Missing firebase-simple-login dependency

The firebase package no longer includes references to firebase-simple-login, meaning that if you navigate to the current firebase-login demo, it's broken:

We need to update bower.json to include it. PR coming up.

Link to redirect or open popup for auth doesn't work in Facebook browser

I seem to have a problem with Facebook or Google authentication when my login link is visited from within the iOS Facebook browser. I’ve confirmed that other popup links and redirects in general can work within the browser, but it for some reason it blocks Firebase auth popup. (We haven’t had problems with any other browsers blocking the popup.)

Here is the code for my Polymer element 'twt-auth-panel’ that provides the content of an iframe that I open when the user clicks the Sign In link.

<polymer-element name="twt-auth-panel" attributes="user" layout vertical center>
  <template>
    ...
    <firebase-login id="firebaseLogin" statusKnown="true" redirect="false"
                    location="{{baseUrl}}" provider="{{authProvider}}"
                    on-login="{{onLogin}}" on-error="{{onError}}" params='{"scope": "email,user_location"}'></firebase-login>
    ...
    <paper-button id="fbLoginButton" class="signin-button" on-click="{{ loginFacebook }}"><core-icon icon="social-post:facebook"></core-icon>Sign in with Facebook</paper-button>
    <paper-button id="googLoginButton" class="signin-button" on-click="{{ loginGoogle }}"><core-icon icon="social-post:gplus"></core-icon>Sign in with Google</paper-button>
    ...
  </template>
  <script>
    Polymer('twt-auth-panel', {
      ...
      loginFacebook: function (event, detail, sender) {
        this.user = null;
        this.authProvider = 'facebook';
        this.$.firebaseLogin.login({scope: "email,user_location"});
      },
      loginGoogle: function (event, detail, sender) {
        this.user = null;
        this.authProvider = 'google';
        this.$.firebaseLogin.login({scope: "email"
                                           + ",https://www.googleapis.com/auth/plus.me"
                                           + ",https://www.googleapis.com/auth/plus.profiles.read"});
      },
      ...
    });
  </script>
</polymer-element>

As you can see, within this element I have a couple of paper-buttons with on-click handlers that invoke the login() method of the firebase-login element. In all other browsers we've tested, these buttons work to open the Firebase authentication popups, but in the Facebook mobile app, the button actions are ignored.

From my reading of the code, this is probably a result of the way the popup/redirect is implemented in the firebase/firebase.js script -- perhaps too many levels of indirection before the popup window finally gets opened. I've submitted a support request to Firebase and am waiting to hear back from them. In the meantime I thought I'd check if anyone else might have encountered this issue within the Facebook browser.

Many thanks in advance!
Nathan

User data not returned when a new user is created

In createUser, user data is not being returned when the user-created event is fired.

Input/contenteditable connected to firebase loses focus on key press !

When starting to type the input loses focus. I checked the todolist example, but I cannot see any differences that would affect the sideeffect.
http://jsbin.com/diqabi/46/edit?html,output
Firebase: https://intense-heat-1283.firebaseio.com/test.json

How Can I solve this issue ?

Add Firebase New Enhanced Query Support

Please add the new Firebase New Enhanced Query Support Learn more at:
https://www.firebase.com/blog/2014-11-04-firebase-realtime-queries.html

// Sample code:

var ref = new Firebase("https://dinosaur-facts.firebaseio.com/");
ref.orderByChild("height").on("child_added", function(snapshot) {
  console.log(snapshot.key() + " was " + snapshot.val().height + " meters tall");
});

// Another Sample
var ref = new Firebase("https://dinosaur-facts.firebaseio.com/");
ref.orderByChild("height").startAt(3).on("child_added", function(snapshot) {
  console.log(snapshot.key())
});