Paper-dropdown-menu : error with Polymer 2.0 - polymer

Hi stackoverflow users,
I want to use the paper-dropdown-menu with polymer 2.0 but when I click on the element, the error below occurs :
Uncaught TypeError: Cannot assign to read only property 'target' of object '#<AnimationPlaybackEvent>'
at b.Animation.<anonymous> (web-animations-next-animation.js:223)
I have installed paper-dropdown-menu #2.0-preview.
I tried the very simple example code from the docs:
<paper-dropdown-menu label="Dinosaurs">
<paper-listbox class="dropdown-content" selected="1">
<paper-item>allosaurus</paper-item>
<paper-item>brontosaurus</paper-item>
<paper-item>carcharodontosaurus</paper-item>
<paper-item>diplodocus</paper-item>
</paper-listbox>
</paper-dropdown-menu>
Could you help me ?
Thank you.
Phil

This appears to be a compatibility issue with the web-animations-js library. They released a build on April 13, 2017 that started causing this issue with the 1.x version of paper-drowpdown-menu as well. Anyone doing a bower update after this date will probably see the same behavior until it's resolved.
Adding this to your bower.json file should fix the behavior for you:
"web-animations-js": "web-animations/web-animations-js#2.2.2"
I've filed an issue w/ paper-dropdown-menu regarding this breaking dependency: https://github.com/PolymerElements/paper-dropdown-menu/issues/241

Related

'dialog' is not a known element in Angular 9 with Ivy

After upgrading to Angular RC.3 and switching to Ivy in a project I get the following error:
Error: dialog is not a known element: 1. If dialog is an Angular component, then verify that it is part of this module. 2. To allow any element add NO_ERRORS_SCHEMA to the #NgModule.schemas of this component.
Indeed I have a markup like this using a <dialog>-element:
<dialog [attr.open]="open ? '' : null"></dialog>
Even though the browser coverage is not 100% dialog is still a valid HTML element.
Did they miss to support it? Is this a bug in Anglaur or Ivy? Can I only use the dialog-element, when I also use NO_ERRORS_SCHEMA in the components?*
* Which I actually don't want to activate.

PHPStorm and ES6 arrow functions inside vue template tag

I'm using PHPStorm 2017.2 and today I faced with some trouble. Is there any way to use arrow functions within vue attributes inside template? Now, i'm getting "expression expected" error highlighted by PHPStorm, when trying to write something like
<template>
<button #click="() => {some code... }">Click me</button>
</template>
Arrow functions works fine inside script tag, but problem with template tag drives me mad.
Functions are not allowed in the template syntax so if the plugin allows it or not doesn't matter anyways + its not good practice --> create a method for it much cleaner and more readable.
Git hub issue for similar problem.
https://github.com/vuejs/vue-loader/issues/364
I'd say it's supported already in vuejs 2.0. I have tested it and it's also written in the docs:
<comp :foo="bar" #update:foo="val => bar = val"></comp>
Just PhpStorm is complaining... If you raise a bug I will upvote!

Angular 2 how to use Applets

I have currently a problem with embeding my Applet .jar file into my Angular 2 Project.
Most of the solution mention using the <applet></applet> tag but I get the following error when i try it:
Unhandled Promise rejection: Template parse errors:
'applet' is not a known element:
1. If 'applet' is an Angular component, then verify that it is part of this module.
2. If 'applet' is a Web Component then add "CUSTOM_ELEMENTS_SCHEMA" to the '#NgModule.schemas' of this component to suppress this message.
How do I solve this?
Ok, HTML5 replaced <applet></applet> with <object></object>.
Tried it and now it works

paper-input broken with odd halo

I have a Polymer application for which I am getting the following warning:
/deep/ combinator is deprecated. See https://www.chromestatus.com/features/6750456638341120 for more details.
So I did a bower update to my components. Here is the relevant part of my bower.json file:
"dependencies": {
"polymer": "Polymer/polymer#^1.1.0",
"iron-input": "PolymerElements/iron-input#~1.0.6",
"neon-animation": "PolymerElements/neon-animation#~1.0.7",
"google-map": "GoogleWebComponents/google-map#~1.1.4",
"paper-elements": "PolymerElements/paper-elements#~1.0.5",
"iron-form": "PolymerElements/iron-form#~1.0.11",
"Autolinker.js": "~0.22.0",
"paper-checkbox": "PolymerElements/paper-checkbox#~1.1.3",
"masonry": "^4.1.0"
}
and now I am getting another error,
This file is deprecated. Please use iron-flex-layout/iron-flex-layout-classes.html, and one of the specific dom-modules instead
which was inserted directly as a console.warn() when polybuilding my application. No, it does not say what "this file" is that's deprecated.
Not sure if these warnings are in any way related to the new issue I've created for myself by doing the bower update, namely that the paper-input in my modal form no longer works and has a weird halo around it:
Any ideas what is causing the error? Is it related to the warnings?

Primefaces rating component with JSF2

I am trying to use primefaces 3.3 with JSF 2. When I try to access the page , the components are not getting displayed.
There are some JS error on the page.
Uncaught ReferenceError: $ is not defined :
Uncaught ReferenceError: PrimeFaces is not defined
<p:rating starts="10"/>
Any Idea?
Add h:head to your page. See;
http://www.primefaces.org/gettingStarted.html