I've copied the hello world example into a VueJS app, things work as expected.
I then changed added:
router: { name: 'manhattan' },
to the link constructor. when I move the nodes around I get the link rendering as in the attached screen shot.
Has anyone else ever encountered this and have a fix?
mc.
most likely you've forgotten to include the join.css stylesheet
Related
I am quite new to puppeteer and am stuck with trying to click on an element. In the image, that is the "i" element, I want to click on.
When I try to click it, I get the error "Node is either not visible or not an HTMLElement". I guess it is not visible, because there it the nb space in front of it.
Is there a way still to click on it? When I manually click on it, it works, so I would think that puppeteer would also be able to do it?
Thanks,
Benni
After quite some testing I found a way how to click it. First, this didnt work:
page.click(selector)
This brought up the error that specified before.
What worked now was that:
page.evaluate(function (selector) {
const elements = document.querySelectorAll(selector);
elements.forEach((element) => {
element.click();
});
}, selector);
Not sure why the element is coming up multiple times. It should be there only once.
I am not an expert with puppeteer, but happy that this worked. Maybe it helps someone else.
I installed a MatExpansionPanel in my angular web page and the drop down arrow is not visible in that panel. Instead the header and the content is visible by default.
I tried copying a piece of code from "Angular Material" site and still unable to fix the problem
<mat-accordion>
<mat-expansion-panel>
<mat-expansion-panel-header>
MY POSTS
</mat-expansion-panel-header>
<p>Post</p>
</mat-expansion-panel>
I need that drop down option to be enabled
Piece of CodeThe panel
I've created an stackblitz link (where you can see in live your code).
https://stackblitz.com/edit/angular-7vqs8j
I'm not sure what is happening to you, but it seems that your code is nice.
Maybe do you forget some imports??
Here is the link with the API for the Expansion panel:
https://material.angular.io/components/expansion/api
If you have any question feel free to ask.
It seems like you hide the button with the 'MY POSTS'. You should use it in this way:
For title:
<mat-panel-title>
MY POSTS
</mat-panel-title>
For description:
<mat-panel-description>
Type your description
</mat-panel-description>
Here is the link:
Angular Material Expansion Panel
specifically, I would like to test that the logo appears on the home page of the app. I guess I am not sure what I should use to look for the image.
I tried
it('has a logo', function () {
cy.visit('http://localhost:3000')
cy.get('img').should('contains' , 'My-Logo.png')
})
instead of cy.get I also tried to just use
cy.contains('My-Logo.png')
but it also fails.
I wasn't sure what element I should use or if I should be using get, but it fails. When I look at the source code for the web page, the logo is hidden within the javascript (nodeJS, vueJS,and expressJS application) and I noticed the javascript seems to add a sequence of numbers and letters to the image when I go to the image page even though the image name in the assets folder does not have it on there. My-Logo.d63b7f9.png.
I figured out the solution on my own.
cy.get('form').find('img').should('have.attr', 'src').should('include','My-Logo')
I inspected the element and found the <img src... line was embedded within a <form>. I could do a cy.get('form') and pass, but could not do a cy.get('img') to pass. So then I chained them together and it passed. I am not sure why I cannot just simply add the second should statement, but it failed when I tried to just run:
cy.get('form').find('img').should('include','My-Logo')
I am not entirely sure why, but it needed the first "should" statement. I got around VUE adding the sequence of numbers and letters by just asking for the name of the file without the extension. I hope this maybe helps someone else as the documentation did not seem to cover this.
you can use only one should statement like:
cy.get('form').find('img').should('have.attr', 'src', 'My-Logo')
the third arg of should is the value to match with the element attribute.
I have recently started working with JointJS. I have not seen any example/tutorial on their website mentioning creating of link again once it is deleted. For example on this link.
http://jointjs.com/demos/org
I wonder if its possible to create the link again between the two Members once it is deleted.
I tried with this code in the function function (x, y, rank, background, textColor):
'.rank': { text: rank, fill: textColor, 'word-spacing': '-5px', 'letter-spacing': 0, magnet: true, pointerevents:'none' }
But its not working.
I am not sure if the member type has ports. If yes you need to add ports to recreate the links once rendered. If you look at the source code, the links are created during render so if you refresh the page or run the code again the links come back.
I've been trying to make blueimp-image-gallery work with Jade on my Node.js server.
I've followed the instructions and came up with this .jade page:
extends layout
block content
h1 Test
div(id='blueimp-gallery-dialog', data-show='fade', data-hide='fade')
div(class='blueimp-gallery blueimp-gallery-carousel blueimp-gallery-controls')
div(class='slides')
a(class='prev') ‹
a(class='next') ›
a(class='play-pause')
div(id='links')
a(href='http://mypage.com/1.jpg' title='Frente' data-dialog)
img(src='http://mypage.com/2.jpg' alt='Frente')
a(href='http://mypage.com/6.jpg' title='Piscina' data-dialog)
img(src='http://mypage.com/6.jpg' alt='Piscina')
a(href='http://mypage.com/0.jpg' title='Garagem' data-dialog)
img(src='http://mypage.com/0.jpg' alt='Garagem')
script(src='//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js')
script(src='//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js')
script(src='http://blueimp.github.io/Gallery/js/jquery.blueimp-gallery.min.js')
script(src='js/blueimp-gallery.min.js')
For some reason all I see are static links to the pictures referenced above. When I click them, instead of see the galery as the example show I get redirected to the image link itself.
Blueimp-image-gallery pages states a few requirements, but I'm not sure if I need them or how to install them.
Can you help me to make it work?
Check your javascript console to see if there are any javascript errors on the page. If there are, they should give you a place to start when looking for a fix!