What could be causing session loss on dialog popup chrome? - google-chrome

Question

I am working on an application that initiates a popup dialog, this dialog requires a session however it is getting lost. This is happening on Chrome only so far. I've test in Opera and Edge, both are working. I am only losing the session in Chrome. I submitted this question in SuperUsers site as well. Apologies for the additional code, it's probably not necessary.
Below is a jsfiddle that produces a dialog.
https://jsfiddle.net/0kv4bqjy/2/
Html
<div id="apollo-actions-wrapper" data-uri="www.sap.com">
<div id="apollo-inner-wrapper">
<img src="https://www.apolloproject.xyz/a/images/apollo-launcher.png"/>
<span id="apollo-likes"><span id="likes-span"></span> likes</span>
<span id="apollo-shares"><span id="shares-span"></span> shares</span>
<span id="apollo">Apollo</span>
</div>
</div>
Javascript
var ResourceRequest = function(){
var http = function(uri, method){
var request = new XMLHttpRequest();
request.onprogress = updateRequestProgress;
return new Promise(function(resolve, reject){
request.onreadystatechange = function () {
if (request.readyState !== 4) return;
if (request.status >= 200 && request.status < 300) {
resolve(request);
} else {
reject({
status: request.status,
statusText: request.statusText
});
}
};
request.open(method ? method : 'get', uri, true);
request.send();
});
}
var updateRequestProgress = function(arg){
}
return {
http: http
}
}
var popup = {}
var actionsWrapper = document.getElementById("apollo-actions-wrapper")
var innerActionsWrapper = document.getElementById("apollo-inner-wrapper");
var launchApollo = document.getElementById("launch-apollo")
var likesWrapper = document.getElementById("apollo-likes")
var sharesWrapper = document.getElementById("apollo-shares")
var likesSpan = document.getElementById("likes-span")
var sharesSpan = document.getElementById("shares-span")
var apolloSpan = document.getElementById("apollo")
addActionStyles()
var req = new ResourceRequest()
var uri = actionsWrapper.getAttribute("data-uri")
var likesUri = "https://www.apolloproject.xyz/a/resource/likes?uri=" + encodeURIComponent(uri);
var sharesUri = "https://www.apolloproject.xyz/a/resource/shares?uri=" + encodeURIComponent(uri);
var likesUriDev = "/a/resource/likes?uri=" + encodeURIComponent(uri);
var sharesUriDev = "/a/resource/shares?uri=" + encodeURIComponent(uri);
req.http(likesUri).then(updateLikes).catch(error)
req.http(sharesUri).then(updateShares).catch(error)
var launcher = document.getElementById("launch-apollo")
launcher.addEventListener("click", function(){
var uri = actionsWrapper.getAttribute("data-uri")
var src = "https://www.apolloproject.xyz/a/resource?uri=" + encodeURIComponent(uri)
var srcDev = "http://localhost:8080/a/resource?uri=" + encodeURIComponent(uri)
var height = 575;
var width = 437
var top = (screen.height - height) / 4;
var left = (screen.width - width) / 2;
popup = window.open("", "ApolloResourceAction", 'top=100 left=' + left + ' width=437 height=575')
popup.document.write('<iframe width="' + width + '" height="' + height + '" allowTransparency="true" frameborder="0" scrolling="yes" style="width:100%;" src="'+ src +'" type="text/javascript"></iframe>');
})
function updateLikes(request){
var data = JSON.parse(request.responseText)
console.log(data)
likesSpan.innerHTML = data.likes
}
function updateShares(request){
var data = JSON.parse(request.responseText)
sharesSpan.innerHTML = data.shares
}
function addActionStyles(){
innerActionsWrapper.style.cssText = "position:relative;width:140px; height:57px;"
launchApollo.style.cssText = "color:#2cafed;font-size:39px;font-weight:bold;text-decoration:none;"
likesWrapper.style.cssText = "position:absolute; left:49px; top:0px; font-size:12px;"
sharesWrapper.style.cssText = "position:absolute; left:49px; bottom:27px; font-size:12px;"
likesSpan.style.cssText = "font-size:12px;"
sharesSpan.style.cssText = "font-size:12px;"
apolloSpan.style.cssText = "font-size:11px;display:block;clear:both;"
var css = '#launch-apollo:hover{ color: #617078 !important }' +
'#apollo-actions-wrapper{ text-align:left; display:inline-block; width:140px; height:57px; }';
var style = document.createElement('style');
if (style.styleSheet) {
style.styleSheet.cssText = css;
} else {
style.appendChild(document.createTextNode(css));
}
document.getElementsByTagName('head')[0].appendChild(style);
}
var timer = setInterval(function () {
if (popup.closed) {
clearInterval(timer);
window.location.reload(); // Refresh the parent page
}
}, 1000);
function error(){
console.log(error)
}
Thank you.

Answer 1

It turned out Chrome had updated it's cookie requirements a while back for popups within external sites. In my case I had to set SameSite to None and Secure to true.