Problems when loading Vaadin/Polymer custom elements (Error message: (0 , $csb__dommodule.DomModule).import is not a function) - polymer

Could someone please help me and tell me what I am doing wrong here when I try to load a vaadin custom element button, because I get an error message (0 , $csb__dommodule.DomModule).import is not a function? TYVM :)
import "#vaadin/vaadin-button";
document.getElementById("app").innerHTML = `
<h4>Vaadin Button</h4>
<section>
<vaadin-button>This is a button</vaadin-button>
</section>
`;
https://codesandbox.io/s/recursing-swartz-tbe4y?file=/src/index.js

This is a codesanbox specific issue. If you run your sandbox locally then it works fine. I just tested that
Steps:
export your sandbox
run npm i
run npm start
I just created this issue in codesandbox client repo.
Working webcomponents.dev demo: https://webcomponents.dev/edit/RvnCgQUcXyckBJdjBCgl
Update: Linked Codesandbox issue has been fixed :)

Related

Call to plugin has timed out compilerMetadata - deployMetadataOf - {"from":"udapp","path":"compilerMetadata"}

I'm getting an error in the remix ide:
call to plugin has timed out compilerMetadata - deployMetadataOf - {"from":"udapp","path":"compilerMetadata"}
The error is also seen as:
[TIMED OUT]: Call to method "deployMetadataOf" from "udapp" to plugin...
This is most like due to Metamask account being changed.
Refresh the Remix page and it should work fine.
You can also just restart your browser. That worked for me.
[ANSWER] This seems to be a browser based issue. I receive this error from Remix IDE on a Chrome instance, but when I switch to Firefox, the issue doesn't persist.
Clearing browser cache (ctrl + shift + delete) worked for me. PS if your using Remix, make sure to save your work somewhere just in case

Error Cypress chrome-error://chromewebdata/

I tell you my problem, I was testing the cypress tool on a page that makes purchases online, when doing a test with the following code:
let button_add_cart= "#add-to-cart-button-4";
//cy.wait(3000);
cy.get(button_add_cart)
.click();
//cy.wait(5000);
//let button_2= "#topcartlink > a > span.cart-label";
cy.get('#bar-notification > div > p > a')
.click();
The second Get references another to href,this when executed, I throw the following error first
enter image description here
To solve this I should add en archivo cypress.json the property "chromeWebSecurity": false. But when added it throws me the error chrome-error://chromewebdata/
enter image description here
By also adding the property "baseUrl": "http://demo.nopcommerce.com", this domain change but when changed as shown in the image, it does not pass the added articles, which breaks the test flow.
cy.visit('/cart');
let value= ".product-unit-price";
let costo = "$1,800.00";
cy.get(value)
.contains(costo);
When changing path this should pass me the added items
I would appreciate the help
Upgrading the version to 6.1.0 helped me get rid of same issue.
I did following steps for updation:
Update cypress by either of command npm install --save-dev cypress#6.1.0 OR yarn upgrade cypress#6.1.0
Execute by command $node_modules/.bin/cypress open
In my case, I was getting chrome-error://chromewebdata/ because the test involved submitting a <form> into a URL that wasn't responding.
It was <form method="POST" action="https://localhost:8443/something"> but there was no server listening at localhost:8443, I forgot I was using another address.
So it was a good thing the test failed (the test was wrong), but I wish Cypress told me something like "Unable to connect to localhost:8443" instead of saying chrome-error://chromewebdata/. I would have noticed my mistake much sooner...

Google Chrome: DOMException: Registration failed - manifest empty or missing

I am trying to implement Push Notifications on my website (using Pushpad). Therefore I created a "manifest.json" with following content:
{
"gcm_sender_id": "my_gcm_sender_id",
"gcm_user_visible_only": true
}
of course I created a valid GCM-Account and have a sender id
I put the manifest.json into my root directory and I also added this line to my index.php:
<link rel="manifest" href="/manifest.json">
Using Firefox everything works fine and I can send and receive push notifications (so I think the manifest-include works fine), but Chrome won't work...
The console shows following error:
Uncaught (in promise) DOMException: Registration failed - manifest empty or missing
I searched Google for a long time and tried everything I found, but nothing works.
What I tried:
created the manifest.json with "Editor" and saved it as type All Types (so no hidden .txt-file) and also with UTF-8-Encoding.
restarted Chrome
cleared Chrome's cache, history, etc.
I really hope somebody can help me.
For me it was a redirect. The manifest.json must return a 200 status code (must be directly available from the server), without any redirects.
You can check the response via
wget --max-redirect=0 https://example.com/manifest.json
or
curl https://example.com/manifest.json
I faced same issue,added manifest file right after head tag . which worked for me.Cheers!
This may be an issue with your Service Worker scope. I ran into a similar problem when I rearranged my files/directories. Make sure your sw.js is on the same level as your manifest.json, otherwise the service worker won't be able to find your manifest. Try putting them both in the root of your directory. Optionally, you can specify the scope of your service worker by adding it to serviceWorker.register():
if ('serviceWorker' in navigator) {
navigator.serviceWorker.register('/sw-test/sw.js', {scope: '/sw-test/'})
.then(function(reg) {
// registration worked
console.log('Registration succeeded. Scope is ' + reg.scope);
}).catch(function(error) {
// registration failed
console.log('Registration failed with ' + error);
});
}
Read more here:
https://developer.mozilla.org/en-US/docs/Web/API/Service_Worker_API/Using_Service_Workers
Was wondering if your "manifest.json" is public accessible ?
If not maybe you can try to set it public accessible to see if that helps or not.
And it seems that the current chrome, when getting the "manifest.json" won't supply the cookies.
Because I didn't find an answer anywhere out there in the WWW, but managed to get it working after some time I want to provide my solution/answer for other users, who probably have the same problem:
In the file where I inlcuded the Pushpad files I wrote some PHP-Code before the <head>-Tag to include some files, e.g. for database connection. After I moved the PHP-Code below the <head>-Tag everything worked fine.
There seem to be three ways to fix this bug:
a) No redirects for "manifest.json" file.
b) Put a link to this file at the top of the tag.
c) Be sure, that there is no other manifest file before this one, cause it seems that web push script will try to import the first one and return an error due to the wrong data.
I have tried all three and finally forced Chrome to behave.
Adding the following block fixed this for me:
self.addEventListener('push', (event) => {
const title = 'Get Started With Workbox';
const options = {
body: event.data.text()
};
event.waitUntil(self.registration.showNotification(title, options));
});

Newbie: Getting basic app script to work, encountered AppKey error

I am following the instructions here to get a basic appscript to work. When I load the given page ("quickstart.html"), it does properly prompt me to "authorize" the connection. After authorizing, it redirects me to an error page with the error:
[ORIGINAL ERROR] generic::not_found: com.google.apps.docs.error.DocumentNotFoundException: Invalid or missing required AppKey
The invalid/missing AppKey suggests that this is a basic configuration issue. Other than the html file itself, where else should I be looking to find how/where the "AppKey" is managed?
Aha, figured it out. I had neglected to fill in the ENTER_YOUR_SCRIPT_ID_HERE variable. That was easy! :)

why does console.log not output in chrome?

Recently I read a query about "What does console.log do" and I read an answer, tried using it and found that despite the answer stating that it outputs to the console in googles browser, I just tried it and I get no output.
I did try this code:
function put(p){
if ( window.console && window.console.log ) {
console.log(p); // console is available
}else{
alert(p);
}
}
BUT... I get neither console output or alert and furthermore .log is a Math property, what gives with that?
Make sure that in the Developer Tools the Filter in the console section is set to All or Logs...
I had a similar experience where I couldn't see any of my console.log output and it was because the console was set to filter on Errors only... All the log entries were there - they just weren't visible.
Bonus marks: you can also Ctrl + Click to select multiple filters (Errors + Logs for example).
Press F12 and look at in Developer Tools: Console. I tried your code just now, works fine for me -- Chrome version 30.0.
Since you're after console logging, not mathematical logarithms, perhaps you could stop going on about there being similarly-named function in the Math object. It's not relevant here whatsoever.
You're also coming across just a little shouty. console.log() works fine, and your question didn't indicate that you knew where to look. This is totally your problem, but I'm trying to help you. I can obviously only go on the information you provide, and I can't say your initial question was written very clearly.
It appears, since the snippet of code you posted works here absolutely fine, that your calling code & containing (which you haven't posted) would be the cause of the problem. You should debug these, to find out what's going wrong.
Do you know how to use the Chrome debugger? Are there any error messages showing in Chrome or on the console?
Test it on a simple page if necessary, to rule out other errors in the page/ or surrounding context breaking it. One common mistakes is declare functions in a jQuery ready handler or similar, and then try & access them globally. Make sure your logging function is actually global (outside any other function(){} or object {} blocks).
Lastly, it's good to have a logging function for portability (I have one myself) but put() is not a good name for it. Naming it consoleLog() or log() would be better.
Had the same issue .
Make sure your using de right path when you try import thing's .
Example whit my issue :
Wrong path ----> ** import normalizedData from 'normalizr'; **
Right path ---> ** import normalizedData from '../schemas/index.js'; **
I had also faced the same problem. Make sure you apply no filter in the console. It worked for me.