Google share button not taking the right schema.org data in multiple itemscope situation - google-plus

Question

The following mark up is quite complex, I know, it derives from a typical wordpress site building structure. So I cannot change it. And I wish to reproduce it here completely (leaving out the classes etc.):
<div id="myOuterSection" itemscope itemtype="http://schema.org/CreativeWork">
<meta itemprop="name" content="A name for this section that contains several artworks" />
<meta itemprop="description" content="A brief description also." />
<meta itemprop="url" content="http://www.mywebsite.com/#where-to-scroll-to" />
<div id="myId" class="myClasses">
<div class="container">
<div class="myInnerClasses">
<div class="mySecondInnerClasses">
<div class="myThirdInnerClasses">
<div class="artwork-container" itemprop="workExample" itemscope itemtype="http://schema.org/VisualArtwork">
<meta itemprop="image" content="http://www.mywebsite.com/wp-content/uploads/2017/06/my-svg-replace-image.png" />
<meta itemprop="name" content="My desired share post title" />
<meta itemprop="description" content="The description of the shared stuff I would love to see here also." />
<meta itemprop="url" content="http://www.mywebsite.com/#where-to-scroll-to" />
<div class="svg-code-content-wrapper">
<!-- svg code -->
</div>
<div class="social-share-wrapper">
<ul class="social-share-list">
<li>
<a class="share-btn-google" href="https://plus.google.com/share?url=http%3A%2F%2Fwww.mywebsite.com%2F" target="_blank">
<i class="fa fa-google-plus"></i>
</a>
<!-- some others -->
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
To explain a little why I use meta tags here (well knowing that this technique should be used “sparingly” as I read): I have no visible texts on the artworks and the images are in svg code. However, I want them to be sharable without website context adding some explanation on the shared post. (which is, by the way, very easy to achieve with fb, pinterest, tumblr, twitter etc.)
I also tested the result of this structure in Google testing tool (https://search.google.com/structured-data/testing-tool)
It showes a perfect tree with outer and inner itemscope and all the data (names, description, image url etc.). At least it looks so for me and displays no errors or anything similar. For Google so it seems ok, also, I guess.
Yet, the Google share button which is nested perfectly inside the second (inner) scope does not reflect any of the shown data, neither images nor names or titles when the post opens in the new share tab. The weird thing is that in the beginning sometimes it worked, but later he seemed to fetch only the top first one on the page, later he skipped them all and took the site’s regular title and description with the first real image (img tag) he founds on the page.
I tried also emptying the cache, placed no-cache tags in the website header and so on.
This Google share button casuality stuff drives me nuts.
Is there someone out there with similar experiences? Or someone who scans my code and sees some obvious errors that I am not able to see? False schema.org structure or whatever?
Thanks so much in advance. Any help is much appreciated.
I can also give the real web url if someone likes to see it.