3

I was writing a Polymer app when I realized my paper-dropdown-menu element was not working on updated Firefox but giving no problems in Chrome.

All bower components are correctly installed and accessible.There is no console errors on any of the browsers.

<html>
<head>
    <script src="bower_components/webcomponentsjs/webcomponents.min.js"></script>

    <link rel="import" href="bower_components/polymer/polymer.html">

    <link rel="import" href="bower_components/core-menu/core-menu.html">
    <link rel="import" href="bower_components/paper-item/paper-item.html">
    <link rel="import" href="bower_components/paper-dropdown/paper-dropdown.html">
    <link rel="import" href="bower_components/paper-dropdown-menu/paper-dropdown-menu.html">
    <link rel="import" href="bower_components/paper-button/paper-button.html">
</head>

<body>

    <style>
        paper-dropdown-menu {
            left: 24px;
            width: 180px;
        }
    </style>

      <paper-dropdown-menu label="Your favorite food">
          <paper-dropdown class="dropdown">
              <core-menu class="menu">
                  <paper-item>Pasta</paper-item>
                  <paper-item>Pizza</paper-item>
              </core-menu>
          </paper-dropdown>
      </paper-dropdown-menu>

      <paper-button raised>CLICK ME</paper-button>
</body>
</html>




UPDATE: I tried downloading the paper-dropdown-menu demo and running it in localhost. Installed all components using bower but still don't work in Firefox. In Chrome runs fine.

<html>
<head>
<script src="bower_components/webcomponentsjs/webcomponents.js"></script>

<link href="bower_components/core-collapse/core-collapse.html" rel="import">
<link href="bower_components/core-menu/core-menu.html" rel="import">
<link href="bower_components/paper-dropdown/paper-dropdown.html" rel="import">
<link href="bower_components/paper-item/paper-item.html" rel="import">
<link href="bower_components/paper-dropdown-menu/paper-dropdown-menu.html" rel="import">
</head>
<body>

<template is="auto-binding">

    <paper-dropdown-menu label="Your favorite pastry">
        <paper-dropdown class="dropdown">
        <core-menu class="menu">
            <template repeat="{{pastries}}">
            <paper-item>{{}}</paper-item>
            </template>
        </core-menu>
        </paper-dropdown>
    </paper-dropdown-menu>

</template>

<script>
    scope = document.querySelector('template[is=auto-binding]');

    scope.pastries = [
    'Apple fritter',
    'Croissant',
    'Donut'
    ];
</script>

</body>
</html>
2

For some reason it would not work on localhost port 8000 but works great on localhost port 80.

Just had to run the local server like this:

sudo python -m SimpleHTTPServer 80
|improve this answer|||||
  • 1
    Changing the port had no effect on my firefox. – socca1157 Oct 22 '15 at 17:37

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.