Selenium doesn't move to the next element - selenium

I am trying to make a instagrambot with selenium. I am trying to click post or story in the dropdown menu, when inspect(developer tools) is open, they don't work when I first click the create [+] button. In terminal it looks like it just pauses and don't move on to the next element, it doesn't give an error.
But when I click the create [+] button myself and wait for the "post" xpath to click on post, it works and opens the filedialog.
<div aria-hidden="false" class="_ad8j _aa5x _aa5-"><div class="_aa61"><div class="_abm4" aria-disabled="false" role="button" tabindex="0" style="cursor: pointer;"><div aria-labelledby="f164fa7b8b81fb f25b63fbbbaab04 fa96d5b7069bd8 f8578df4b0a8" class="_ab8w _ab94 _ab97 _ab9f _ab9k _ab9p _ab9- _aba8 _abcm"><div class="_ab8w _ab94 _ab99 _ab9h _ab9m _ab9o _abcm"><div class="_ab8w _ab94 _ab99 _ab9f _ab9m _ab9p _abcm" id="f25b63fbbbaab04"><div class="_aacl _aaco _aacu _aacx _aada"><div class="_ab8w _ab94 _ab99 _ab9h _ab9m _ab9p _abbi _abcm" style="height: 28px;"><div class="_aacl _aaco _aacu _aacx _aada">Post</div></div></div></div></div><div class="_ab8w _ab94 _ab99 _ab9f _ab9m _ab9p _abb1 _abcm"><svg aria-label="Post" class="_ab6-" color="#fafafa" fill="#fafafa" height="16" role="img" viewBox="0 0 24 24" width="16"><rect fill="none" height="18" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" width="18" x="3" y="3"></rect><line fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" x1="9.015" x2="9.015" y1="3" y2="21"></line><line fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" x1="14.985" x2="14.985" y1="3" y2="21"></line><line fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" x1="21" x2="3" y1="9.015" y2="9.015"></line><line fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" x1="21" x2="3" y1="14.985" y2="14.985"></line></svg></div></div></div><div class="_abm4" aria-disabled="false" role="button" tabindex="0" style="cursor: pointer;"><div aria-labelledby="f4f45cbdcdfb08 f38d9baa8e9f58 f151c2901bc3fe4 ff0e85333e79a8" class="_ab8w _ab94 _ab97 _ab9f _ab9k _ab9p _ab9- _aba8 _abcm"><div class="_ab8w _ab94 _ab99 _ab9h _ab9m _ab9o _abcm"><div class="_ab8w _ab94 _ab99 _ab9f _ab9m _ab9p _abcm" id="f38d9baa8e9f58"><div class="_aacl _aaco _aacu _aacx _aada"><div class="_ab8w _ab94 _ab99 _ab9h _ab9m _ab9p _abbi _abcm" style="height: 28px;"><div class="_aacl _aaco _aacu _aacx _aada">Story</div></div></div></div></div><div class="_ab8w _ab94 _ab99 _ab9f _ab9m _ab9p _abb1 _abcm"><svg aria-label="Story" class="_ab6-" color="#fafafa" fill="#fafafa" height="16" role="img" viewBox="0 0 24 24" width="16"><path d="M3.914 5.32q.338-.406.714-.778m-3.122 7.855a9.903 9.903 0 0 1-.007-.386 10.49 10.49 0 0 1 .517-3.265m3.242 11.337a10.568 10.568 0 0 1-2.89-3.864m14.482 5.109a10.535 10.535 0 0 1-8.162.649M12.001 1.51a10.505 10.505 0 0 1 7.926 17.392" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"></path><line fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" x1="12" x2="12" y1="8.006" y2="16.006"></line><line fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" x1="16" x2="8" y1="12.006" y2="12.006"></line></svg></div></div></div></div><div class="_aa62"></div></div>
from selenium import webdriver
from selenium.webdriver.chrome.options import Options
from selenium.webdriver.common.by import By
import time
chrome_options = Options()
chrome_options.add_experimental_option("detach", True)
chrome_options.add_argument("--auto-open-devtools-for-tabs")
chrome_options.add_argument("user-data-dir=/Users/smitty/Library/Application Support/Google/Chrome")
chrome_options.add_argument("--profile-directory=Profile 3")
driver = webdriver.Chrome(executable_path="/Users/smitty/Downloads/chromedriver_mac64/chromedriver", options=chrome_options)
driver.get("https://www.instagram.com/")
driver.refresh()
time.sleep(10)
create = driver.find_element("xpath", '/html/body/div[2]/div/div/div/div[1]/div/div/div/div[1]/div[1]/div[2]/section/div[1]/nav/div/header/div/div/div[1]/div[1]/div[2]/a/div')
create.click()
create.click()
#### It works but not when I have the create enabled
time.sleep(5)
Post = driver.find_element("xpath", '/html/body/div[2]/div/div/div/div[1]/div/div/div/div[1]/div[1]/div[2]/section/div[1]/nav/div/header/div/div/div[1]/div[1]/div[1]/div/div/div[1]/div[1]/div')
Post.click()
# time.sleep(10)
# Story = driver.find_element("xpath", '/html/body/div[2]/div/div/div/div[1]/div/div/div/div[1]/div[1]/div[2]/section/div[1]/nav/div/header/div/div/div[1]/div[1]/div[1]/div/div/div[1]/div[2]/div')
# Story.click()
# time.sleep(10)
# driver.quit()
https://i.stack.imgur.com/ZINmk.png


The usual .click() doesn't work for the [+] button: the script hangs on this command, don't know why, it may be that the driver thinks the page is not loaded yet. Then I tried with javascript and it works:
from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC
create = WebDriverWait(driver,9).until(EC.element_to_be_clickable((By.CSS_SELECTOR, 'nav a[role=link]')))
driver.execute_script("arguments[0].click()", create)
After this click a dropdown menu opens. I tried several methods to click on the "Post" button and finally found one that works:
post = WebDriverWait(driver,9).until(EC.element_to_be_clickable((By.XPATH, '//div[text()="Post"]/ancestor::div[#role="button"]')))
from selenium.webdriver.common.keys import Keys
post.send_keys(Keys.RETURN)
## click but hang on
# post.click()
## no click and no hang on
# driver.execute_script("arguments[0].click()", post)
## no click and hang on
# from selenium.webdriver.common.action_chains import ActionChains
# actions = ActionChains(driver)
# actions.move_to_element(post).click().perform()
## no click and no hang on
# actions.move_to_element(post).send_keys(Keys.RETURN).perform()
## no click and hang on
# actions.click_and_hold(post).perform()
# time.sleep(1)
# actions.release(post).perform()
After this click a popup opens which lets you select the file to upload, however you cannot use selenium to interact with it but you have to use pyautogui.

Related

Svg Icon in expo react native appearing half or only a part of the icon

import * as React from 'react';
import { SvgXml } from 'react-native-svg';
export default function SvgComponent() {
const svgcode = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<g id="Iconly/Light-Outline/Profile">
<g id="Profile">
<g id="Group 3">
<mask id="mask0_33437_4900" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="4" y="14" width="16" height="8">
<path id="Clip 2" fill-rule="evenodd" clip-rule="evenodd" d="M4 14.4961H19.8399V21.8701H4V14.4961Z" fill="white"/>
</mask>
<g mask="url(#mask0_33437_4900)">
<path id="Fill 1" fill-rule="evenodd" clip-rule="evenodd" d="M11.9209 15.9961C7.65988 15.9961 5.49988 16.7281 5.49988 18.1731C5.49988 19.6311 7.65988 20.3701 11.9209 20.3701C16.1809 20.3701 18.3399 19.6381 18.3399 18.1931C18.3399 16.7351 16.1809 15.9961 11.9209 15.9961M11.9209 21.8701C9.96188 21.8701 3.99988 21.8701 3.99988 18.1731C3.99988 14.8771 8.52088 14.4961 11.9209 14.4961C13.8799 14.4961 19.8399 14.4961 19.8399 18.1931C19.8399 21.4891 15.3199 21.8701 11.9209 21.8701" fill="black"/>
</g>
</g>
<g id="Group 6">
<mask id="mask1_33437_4900" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="6" y="2" width="12" height="11">
<path id="Clip 5" fill-rule="evenodd" clip-rule="evenodd" d="M6.60986 2.00012H17.2299V12.6187H6.60986V2.00012Z" fill="white"/>
</mask>
<g mask="url(#mask1_33437_4900)">
<path id="Fill 4" fill-rule="evenodd" clip-rule="evenodd" d="M11.9209 3.42776C9.77989 3.42776 8.03789 5.16876 8.03789 7.30976C8.03089 9.44376 9.75989 11.1838 11.8919 11.1918L11.9209 11.9058V11.1918C14.0609 11.1918 15.8019 9.44976 15.8019 7.30976C15.8019 5.16876 14.0609 3.42776 11.9209 3.42776M11.9209 12.6188H11.8889C8.9669 12.6098 6.59989 10.2268 6.60989 7.30676C6.60989 4.38176 8.99189 1.99976 11.9209 1.99976C14.8489 1.99976 17.2299 4.38176 17.2299 7.30976C17.2299 10.2378 14.8489 12.6188 11.9209 12.6188" fill="black"/>
</g>
</g>
</g>
</g>
</svg>
`;
const Svg = () => (
<SvgXml
xml={svgcode}
width='set the width here'
height='set the height here'
/>
);
return <Svg />;
}
I am importing this and using it but the icon is appearing half what's the issue? The SVG is appearing properly in the browser. I have searched a lot but no help. Also tell if there is any other way to use svg in expo app

Not really sure but just a suggestion. Check if you have any other component getting rendered above your SVG.
Why I am guessing this is because since your phone is a relatively smaller device than your browser on a computer, any other component might get squashed thus forcing it to display above your SVG and you might be seeing it as if it's appearing half. On computer screens that might not be the case.
Let me know more about the issue so that I'm more clear about it.

How to replace svg with png?

I have a Blazor app, it uses Applayout.razor component as a logo.
How can I use my own wwwroot/images/mylogo.png instead of the svg image?
Applayout.razor:
<svg width="36" height="36" viewBox="0 0 36 36" fill="none" xmlns="http://www.w3.org/2000/svg">
<g id="Group 2">
<g id="flex">
<path id="Combined Shape" fill-rule="evenodd" clip-rule="evenodd"
...
</g>
</g>
</svg>

Any particular reason not to use IMG tag? Something like this <img src="/images/mylogo.png" />

How to center element inside SVG polygon

I have SVG that is assembled from multiple polygons.
I am trying to put image/button inside polygon center but what ever I try it always put image in x=0 and y=0 of the screen.
<Svg width="546px" height="794px" viewBox="0 0 546 794" version="1.1" >
<G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<G id="item0" transform="translate(1.000000, 1.000000)" fill="#EDAF51" fill-rule="nonzero" stroke="#720D00">
<Polygon id="RX-03" points="206.65269...">
</Polygon>
<Circle x="0" y="0" cx="40" cy="40" r="15" fill="black" />
</G>
With this I get:
But if I put <Circle x="110" y="0" I get
And this is correct but I don't want to use x=110 I am trying to make this circle to be relative to it's parent polygon.
So I can set circle to x=0 y=0 and to keep it inside area of parent polygon.

New answer on the comment of the author of the question
In svg, with mutual positioning between elements, there is only absolute positioning.
Relative positioning in svg, as you want - there is no circle relative to the parent polygon.
Only absolute positioning of a circle will help to place it in the right place
You can create a circle once and clone it several times while positioning:
<use xlink:href="#crc1" x="100" y="150" />
<div class="container">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="546px" height="794px" viewBox="0 0 546 794" >
<defs>
<circle id="crc1" cx="0" cy="0" r="15" stroke="red" />
</defs>
<image transform="translate(0, -300)" xlink:href="https://i.stack.imgur.com/q0PXl.png"
width="100%" height="100%"
/>
<use xlink:href="#crc1" x="100" y="150" />
<use xlink:href="#crc1" x="210" y="110" />
<use xlink:href="#crc1" x="300" y="190" />
<use xlink:href="#crc1" x="385" y="190" />
<use xlink:href="#crc1" x="500" y="190" />
</svg>
</div>

An image can be inserted into any SVG shape in several ways:
Using clipPath
Using mask
Using pattern
With any method of inserting an image, you need to focus on the shape of the template.
If the template has a symmetrical shape, it is necessary to select the original image with the same aspect ratio.
In other words, if the cropping pattern is a circle or regular polygons, then you need to select images with the same width and height.
I translated the React syntax into the regular SVG syntax. If necessary, you can go back
Selected round image badge
Insert this image into the hexagon`
1. Using clipPath
The hexagon acts as a cropping pattern.
<style>
.container {
width:50%;
height:50%;
}
</style>
<div class="container">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 546 794" >
<defs>
<clipPath id="clip">
<path fill="none" stroke="none" stroke-width="2" d="m275.9 190.9 175.6 101.4 0 202.7-175.6 101.4-175.6-101.4 0-202.7z" />
</clipPath>
</defs>
<image xlink:href="https://i.stack.imgur.com/gOrJU.png"
x="0"y="0"
width="100%" height="100%"
clip-path="url(#clip)" />
</svg>
</div>
2. Using mask
.container {
width:50%;
height:50%;
}
image {
mask:url(#msk1);
}
<div class="container">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 546 794" >
<defs>
<mask id="msk1">
<path fill="white" stroke="red" stroke-width="12" d="m275.9 190.9 175.6 101.4 0 202.7-175.6 101.4-175.6-101.4 0-202.7z" />
</mask>
</defs>
<image xlink:href="https://i.stack.imgur.com/gOrJU.png" x="0" y="0" width="100%" height="100%" />
</svg>
</div>
3. Using pattern
.container {
width:50%;
height:50%;
}
path {
fill:url(#ptn1);
stroke:#DBC176;
stroke-width:8;
}
<div class="container">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 546 794" >
<defs>
<pattern id="ptn1" width="1" height="1">
<image xlink:href="https://i.stack.imgur.com/gOrJU.png" x="-24" y="3" width="400px" height="400px" />
</pattern>
</defs>
<path d="m275.9 190.9 175.6 101.4 0 202.7-175.6 101.4-175.6-101.4 0-202.7z" />
</svg>
</div>

How to click on svg icons in protractor?

I need to clicking on this icon to perform few edit functions. However, my code is unable to locate this icon. Can somebody help with the correct locators for this snippet?
<td _ngcontent-c29="" class="custom-td-action mat-cell cdk-column-action mat-column-action ng-star-inserted" mat-cell="" role="gridcell">
<button _ngcontent-c29="" aria-haspopup="true" mat-icon-button="" class="mat-icon-button">
<span class="mat-button-wrapper">
<mat-icon _ngcontent-c29="" class="inv-icon-size--small mat-icon mat-icon-no-color" role="img" svgicon="inv-ellipsis-h" aria-hidden="true">
<svg width="100%" height="100%" viewBox="0 0 17 3" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fit="" preserveAspectRatio="xMidYMid meet" focusable="false">
<!-- Generator: sketchtool 51.3 (57544) - http://www.bohemiancoding.com/sketch -->
<title>E1FE60C0-EF43-4EE7-AF32-E28F60D7C746#1,5x</title>
<desc>Created with sketchtool.</desc>
<defs></defs>
<g id="UX-DESIGNER" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="ui-03list_02--spec--product-type" transform="translate(-1493.000000, -589.000000)"
fill="#333333">
<g id="list/product-type-copy-2" transform="translate(255.000000, 547.000000)">
<g id="Group-10" transform="translate(185.000000, 18.000000)">
<g id="package/list">
<g id="ico/options" transform="translate(1053.000000, 24.000000)">
<g id="Group-4">
<circle id="Oval" cx="1.5" cy="1.5" r="1.5"></circle>
<circle id="Oval-Copy" cx="8.5" cy="1.5" r="1.5"></circle>
<circle id="Oval-Copy-2" cx="15.5" cy="1.5" r="1.5"></circle>
</g>
</g>
</g>
</g>
</g>
</g>
</g>
</svg>
</mat-icon>
</span>
<div class="mat-button-ripple mat-ripple mat-button-ripple-round" matripple=""></div>
<div class="mat-button-focus-overlay"></div>
</button>
<mat-menu _ngcontent-c29="" xposition="before" class="ng-tns-c9-43">
<!---->
</mat-menu>
</td>
Unable to click on svg icon for edit functions.

try following xpath:
//button[#class='mat-icon-button']//mat-icon/*[name()='svg']

Selenium Webdriver - Validate a value in tooltip for a section (bar) of a bar chart

I need to validate the value of the margin (sum) element from the bar chart as shown below. So how do I extract the value 31732 from margin (sum) tooltip for Electrolux vendor (bar 1) in the bar chart?
The html for the div enclosing this value is also given below.
I would appreciate any help to point me in the right direction.
Thanks in advance.
<div id="highcharts-60" class="highcharts-container" style="position: relative; overflow: hidden; width: 727px; height: 378px; text-align: left; font-family: "Lucida Grande","Lucida Sans Unicode",Verdana,Arial,Helvetica,sans-serif; font-size: 12px; left: 0px; top: -0.600006px;">
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="727" height="378">
<defs>
<rect rx="5" ry="5" fill="#FFFFFF" x="0" y="0" width="727" height="378" stroke-width="0" stroke="#4572A7">
<text class="highcharts-title" x="364" y="25" style="font-family:"Lucida Grande", "Lucida Sans Unicode", Verdana, Arial, Helvetica, sans-serif;font-size:10px;color:#3E576F;fill:#3E576F;" text-anchor="middle" zIndex="1">
<g class="highcharts-grid" zIndex="1">
<g class="highcharts-grid" zIndex="1">
<path d="M 106.5 40 L 106.5 291" fill="none" stroke="#C0C0C0" stroke-width="1">
<path d="M 147.5 40 L 147.5 291" fill="none" stroke="#C0C0C0" stroke-width="1">
<path d="M 187.5 40 L 187.5 291" fill="none" stroke="#C0C0C0" stroke-width="1">
<path d="M 228.5 40 L 228.5 291" fill="none" stroke="#C0C0C0" stroke-width="1">
<path d="M 269.5 40 L 269.5 291" fill="none" stroke="#C0C0C0" stroke-width="1">
<path d="M 310.5 40 L 310.5 291" fill="none" stroke="#C0C0C0" stroke-width="1">
<path d="M 350.5 40 L 350.5 291" fill="none" stroke="#C0C0C0" stroke-width="1">
<path d="M 391.5 40 L 391.5 291" fill="none" stroke="#C0C0C0" stroke-width="1">
<path d="M 432.5 40 L 432.5 291" fill="none" stroke="#C0C0C0" stroke-width="1">
<path d="M 473.5 40 L 473.5 291" fill="none" stroke="#C0C0C0" stroke-width="1">
<path d="M 513.5 40 L 513.5 291" fill="none" stroke="#C0C0C0" stroke-width="1">
<path d="M 554.5 40 L 554.5 291" fill="none" stroke="#C0C0C0" stroke-width="1">
<path d="M 595.5 40 L 595.5 291" fill="none" stroke="#C0C0C0" stroke-width="1">
<path d="M 636.5 40 L 636.5 291" fill="none" stroke="#C0C0C0" stroke-width="1">
<path d="M 676.5 40 L 676.5 291" fill="none" stroke="#C0C0C0" stroke-width="1">
<path d="M 717.5 40 L 717.5 291" fill="none" stroke="#C0C0C0" stroke-width="1">
</g>
<g class="highcharts-series-group" zIndex="3">
<g class="highcharts-series" width="611" height="251" transform="translate(717,291) rotate(90) scale(-1,1)" clip-path="url(https://staging.datarpm.com/analytics/4fbf89e5e4b0a97336652433#highcharts-61)" visibility="visible">
<rect rx="0" ry="0" fill="none" x="220.5" y="352.5" width="18" height="258" stroke-width="5" stroke="rgb(0, 0, 0)" r="0" isShadow="true" stroke-opacity="0.05" transform="translate(-1,-1)">
<rect rx="0" ry="0" fill="none" x="220.5" y="352.5" width="18" height="258" stroke-width="3" stroke="rgb(0, 0, 0)" r="0" isShadow="true" stroke-opacity="0.1" transform="translate(-1,-1)">
<rect rx="0" ry="0" fill="none" x="220.5" y="352.5" width="18" height="258" stroke-width="1" stroke="rgb(0, 0, 0)" r="0" isShadow="true" stroke-opacity="0.15000000000000002" transform="translate(-1,-1)">
<rect rx="0" ry="0" fill="#4572A7" x="220.5" y="352.5" width="18" height="258" stroke-width="1" stroke="#FFFFFF" r="0" fill-opacity="1">
<rect rx="0" ry="0" fill="none" x="178.5" y="319.5" width="18" height="291" stroke-width="5" stroke="rgb(0, 0, 0)" r="0" isShadow="true" stroke-opacity="0.05" transform="translate(-1,-1)">
<rect rx="0" ry="0" fill="none" x="178.5" y="319.5" width="18" height="291" stroke-width="3" stroke="rgb(0, 0, 0)" r="0" isShadow="true" stroke-opacity="0.1" transform="translate(-1,-1)">
<rect rx="0" ry="0" fill="none" x="178.5" y="319.5" width="18" height="291" stroke-width="1" stroke="rgb(0, 0, 0)" r="0" isShadow="true" stroke-opacity="0.15000000000000002" transform="translate(-1,-1)">
<rect rx="0" ry="0" fill="#4572A7" x="178.5" y="319.5" width="18" height="291" stroke-width="1" stroke="#FFFFFF" r="0" fill-opacity="1">
<rect rx="0" ry="0" fill="none" x="136.5" y="293.5" width="18" height="317" stroke-width="5" stroke="rgb(0, 0, 0)" r="0" isShadow="true" stroke-opacity="0.05" transform="translate(-1,-1)">
<rect rx="0" ry="0" fill="none" x="136.5" y="293.5" width="18" height="317" stroke-width="3" stroke="rgb(0, 0, 0)" r="0" isShadow="true" stroke-opacity="0.1" transform="translate(-1,-1)">
<rect rx="0" ry="0" fill="none" x="136.5" y="293.5" width="18" height="317" stroke-width="1" stroke="rgb(0, 0, 0)" r="0" isShadow="true" stroke-opacity="0.15000000000000002" transform="translate(-1,-1)">
<rect rx="0" ry="0" fill="#4572A7" x="136.5" y="293.5" width="18" height="317" stroke-width="1" stroke="#FFFFFF" r="0" fill-opacity="1">
<rect rx="0" ry="0" fill="none" x="94.5" y="62.5" width="18" height="548" stroke-width="5" stroke="rgb(0, 0, 0)" r="0" isShadow="true" stroke-opacity="0.05" transform="translate(-1,-1)">
<rect rx="0" ry="0" fill="none" x="94.5" y="62.5" width="18" height="548" stroke-width="3" stroke="rgb(0, 0, 0)" r="0" isShadow="true" stroke-opacity="0.1" transform="translate(-1,-1)">
<rect rx="0" ry="0" fill="none" x="94.5" y="62.5" width="18" height="548" stroke-width="1" stroke="rgb(0, 0, 0)" r="0" isShadow="true" stroke-opacity="0.15000000000000002" transform="translate(-1,-1)">
<rect rx="0" ry="0" fill="#4572A7" x="94.5" y="62.5" width="18" height="548" stroke-width="1" stroke="#FFFFFF" r="0">
<rect rx="0" ry="0" fill="none" x="52.5" y="257.5" width="18" height="353" stroke-width="5" stroke="rgb(0, 0, 0)" r="0" isShadow="true" stroke-opacity="0.05" transform="translate(-1,-1)">
<rect rx="0" ry="0" fill="none" x="52.5" y="257.5" width="18" height="353" stroke-width="3" stroke="rgb(0, 0, 0)" r="0" isShadow="true" stroke-opacity="0.1" transform="translate(-1,-1)">
<rect rx="0" ry="0" fill="none" x="52.5" y="257.5" width="18" height="353" stroke-width="1" stroke="rgb(0, 0, 0)" r="0" isShadow="true" stroke-opacity="0.15000000000000002" transform="translate(-1,-1)">
<rect rx="0" ry="0" fill="#4572A7" x="52.5" y="257.5" width="18" height="353" stroke-width="1" stroke="#FFFFFF" r="0">
<rect rx="0" ry="0" fill="none" x="10.5" y="247.5" width="18" height="363" stroke-width="5" stroke="rgb(0, 0, 0)" r="0" isShadow="true" stroke-opacity="0.05" transform="translate(-1,-1)">
<rect rx="0" ry="0" fill="none" x="10.5" y="247.5" width="18" height="363" stroke-width="3" stroke="rgb(0, 0, 0)" r="0" isShadow="true" stroke-opacity="0.1" transform="translate(-1,-1)">
<rect rx="0" ry="0" fill="none" x="10.5" y="247.5" width="18" height="363" stroke-width="1" stroke="rgb(0, 0, 0)" r="0" isShadow="true" stroke-opacity="0.15000000000000002" transform="translate(-1,-1)">
<rect rx="0" ry="0" fill="#4572A7" x="10.5" y="247.5" width="18" height="363" stroke-width="1" stroke="#FFFFFF" r="0">
</g>
</g>
<g class="highcharts-legend" zIndex="7" transform="translate(298,337)">
<rect rx="5" ry="5" fill="none" x="0.5" y="0.5" width="130" height="25" stroke-width="1" stroke="#909090" visibility="visible">
<text x="30" y="18" style="font-family:"Lucida Grande", "Lucida Sans Unicode", Verdana, Arial, Helvetica, sans-serif;font-size:12px;cursor:pointer;color:#3E576F;fill:#3E576F;" zIndex="2">
<tspan x="30"> margin (sum)</tspan>
</text>
<rect rx="2" ry="2" fill="#4572A7" x="9.5" y="7.5" width="16" height="12" stroke-width="1" zIndex="3" stroke="#FFFFFF" r="0">
</g>
<g class="highcharts-axis" zIndex="7">
<text x="26" y="165.5" style="font-family:"Lucida Grande", "Lucida Sans Unicode", Verdana, Arial, Helvetica, sans-serif;font-size:12px;color:#6D869F;font-weight:bold;fill:#6D869F;" zIndex="7" transform="rotate(270 26 165)" text-anchor="middle">
<g class="highcharts-axis" zIndex="7">
<text x="411.5" y="323" style="font-family:"Lucida Grande", "Lucida Sans Unicode", Verdana, Arial, Helvetica, sans-serif;font-size:12px;color:#6D869F;font-weight:bold;fill:#6D869F;" zIndex="7" text-anchor="middle">
<tspan x="411.5"> margin (sum)</tspan>
</text>
<path d="M 106.5 40 L 106.5 291" fill="none" stroke="#C0D0E0" stroke-width="1" zIndex="7">
<g class="highcharts-tooltip" zIndex="8" visibility="hidden" transform="translate(202.5577832333554,26.04093567342961)">
<rect rx="5" ry="5" fill="none" x="7" y="7" width="131" height="38" stroke-width="5" fill-opacity="0.85" isShadow="true" stroke="rgb(0, 0, 0)" stroke-opacity="0.05" transform="translate(1,1)">
<rect rx="5" ry="5" fill="none" x="7" y="7" width="131" height="38" stroke-width="3" fill-opacity="0.85" isShadow="true" stroke="rgb(0, 0, 0)" stroke-opacity="0.1" transform="translate(1,1)">
<rect rx="5" ry="5" fill="none" x="7" y="7" width="131" height="38" stroke-width="1" fill-opacity="0.85" isShadow="true" stroke="rgb(0, 0, 0)" stroke-opacity="0.15000000000000002" transform="translate(1,1)">
<rect rx="5" ry="5" fill="rgb(255,255,255)" x="7" y="7" width="131" height="38" stroke-width="2" fill-opacity="0.85" stroke="#4572A7">
<text x="12" y="24" style="font-family:"Lucida Grande", "Lucida Sans Unicode", Verdana, Arial, Helvetica, sans-serif;font-size:12px;color:#333333;padding:0;white-space:nowrap;fill:#333333;" zIndex="1">
<tspan style="text-decoration: underline; font-weight: bold;" x="12">Electrolux</tspan>
<tspan style="font-weight:bold" dy="13" x="12"> margin (sum)</tspan>
<tspan dx="3"> : 31732</tspan>
</text>
</g>
<g class="highcharts-tracker" zIndex="9" transform="translate(717,291) rotate(90) scale(-1,1)" width="611" height="251">
<rect rx="3" ry="3" fill="url(https://staging.datarpm.com/analytics/4fbf89e5e4b0a97336652433#highcharts-62)" x="0.5" y="0.5" width="23" height="19" stroke-width="1" transform="translate(693,348)" zIndex="19" stroke="#B0B0B0">
<rect rx="3" ry="3" fill="url(https://staging.datarpm.com/analytics/4fbf89e5e4b0a97336652433#highcharts-63)" x="0.5" y="0.5" width="23" height="19" stroke-width="1" transform="translate(693,328)" zIndex="19" stroke="#B0B0B0">
<path d="M 6 17 L 18 17 18 14 6 14 Z M 12 14 L 9 9 11 9 11 5 13 5 13 9 15 9 Z" fill="#A8BF77" transform="translate(693,348)" stroke="#A0A0A0" stroke-width="1" zIndex="20">
<path d="M 6 14 L 18 14 18 9 6 9 Z M 9 9 L 9 5 15 5 15 9 Z M 9 14 L 7.5 17 16.5 17 15 14 Z" fill="#B5C9DF" transform="translate(693,328)" stroke="#A0A0A0" stroke-width="1" zIndex="20">
<rect rx="0" ry="0" fill="rgb(255,255,255)" x="693" y="348" width="24" height="20" stroke-width="0" fill-opacity="0.001" title="Export to raster or vector image" zIndex="21" style="cursor:pointer;">
<rect rx="0" ry="0" fill="rgb(255,255,255)" x="693" y="328" width="24" height="20" stroke-width="0" fill-opacity="0.001" title="Print the chart" zIndex="21" style="cursor:pointer;">
</svg>
</div>

I assume, that are not testing the highcharts themselves, but only that the correct data is passed to it. Since testing whether the data is visualized correctly would be highcharts's responsibility.
If in JavaScript chart has been assign to a variable (e.g. var chart = new Highcharts.Chart({ ... })), then you can try to get the data by calling the highcharts series data api
int[] data = js.executeScript("return chart.series.data;");
If that doesn't work, then you can always extract the data from the html like this:
//get the element that contains the data
WebElement currentValueElement = driver.findElement(By.xpath('//*[#class="highcharts-tooltip"]//text/tspan[last()]'));
//get the value from that element
int currentvalue = Integer.parseInt(currentValueElement.split(":")[1].trim())

From what I see, the tooltip might be a dynamic Javascript popup like you see with some dropdown menus such as Google search tips. You are the only person to have access to the FULL source (HTML headers) and so only you can figure that out for us. That being the case, if you are desparate, you can use a physical mouse click (using Webdriver Action class) combined with a slight delay and some keystrokes to select and copy (with ctrl-c ) and then access the clipboard with java.awt.Toolkit to get the value and then process it. This is just off the top of my head.
There may be better ways of doing this than what I suggest above. Alternatively, it's very possible that the DOM has access to the values of that tooltip (where you can use a cssSelector to get) but without having access to you page with Firebug (using Firefinder plugin), its hard to tell.

did you try using this xpath and getting text from it?
"//tspan[#dx='3']"