It wouldn't render when a callByValue visualization navigates to Lens

[angorayc]

          > When I edit a Lens by value from a security Dashboard Lens doesn't receive the configuration. 

Edit.Existing.mp4

After calling this.stateTransfer.navigateToEditor in src/plugins/embeddable/public/embeddable_panel/panel_actions/edit_panel_action/edit_panel_action.ts line 105

await this.navigateToApp(appId, {
      path: options?.path,
      openInNewTab: options?.openInNewTab,
      skipAppLeave: options?.skipAppLeave,
    });


# **options** When calling this.navigateToApp from Analytics dashboard
{
  "path": "#/edit_by_value",
  "state": {
    "originatingApp": "dashboards",
    "valueInput": {
      "id": "bdb525ab-270b-46f1-a847-dd29be19aadb",
      "title": "% of target revenue ($10k)",
      ...
    },
    "embeddableId": "bdb525ab-270b-46f1-a847-dd29be19aadb",
    "searchSessionId": "a4dc3245-101c-47d5-92cc-b2138fd322d5"
  }
}

# **options** When calling this.navigateToApp from SecuritySolution dashboard
{
  "path": "#/edit_by_value",
  "state": {
    "originatingApp": "securitySolutionUI",
    "valueInput": {
      "id": "bdb525ab-270b-46f1-a847-dd29be19aadb",
      "title": "% of target revenue ($10k)",
      ...
    },
    "embeddableId": "bdb525ab-270b-46f1-a847-dd29be19aadb",
    "originatingPath": "dashboards/551d72ba-8d5c-449e-8cd6-3faf8c8a6959/edit". <---- SecuritySolution has this
  }
}

When Edit Lens from a visualization in Analytic > dashboard,
Lens app will have the correct breadcrumb Edit ..., as it has the persistedDoc value.

When Edit Lens from a visualization in Security Solution > dashboard,
Lens app always has the Security > Create breadcrumbs, and it has no persistedDoc value.

The persistedDoc value matches the visualization we clicked in the dashboard, but Lens wouldn't have it after leaving from SecuritySolution

Originally posted by @angorayc in #159486 (comment)

[angorayc]

x-pack/plugins/security_solution/public/flyout/shared/hooks/url/use_sync_flyout_state_with_url.tsx
this line:
const syncStateToUrl = useSyncToUrl(FLYOUT_URL_PARAM, (data) => {
flyoutApi.current?.openFlyout(data);
});
Is intercepting the URL change and rewrite the location without hash params

if you try to open Lens and put a breakpoint at line 27 here: packages/kbn-url-state/use_sync_to_url.ts

you will see that the window.location is coming right, but then the hash part is cleaned up

(() => {
    let oldPushState = history.pushState;
    history.pushState = function pushState() {
        let ret = oldPushState.apply(this, arguments);
        window.dispatchEvent(new Event('pushstate'));
        window.dispatchEvent(new Event('locationchange'));
        return ret;
    };

    let oldReplaceState = history.replaceState;
    history.replaceState = function replaceState() {
        let ret = oldReplaceState.apply(this, arguments);
        window.dispatchEvent(new Event('replacestate'));
        window.dispatchEvent(new Event('locationchange'));
        return ret;
    };

    window.addEventListener('popstate', () => {
        window.dispatchEvent(new Event('locationchange'));
    });
})();
window.addEventListener('locationchange', function () {
    console.trace('location changed!');
    debugger;
});

with this you can see that Lens is started with all the correct params, but then the location changes again from /app/lens#/edit_by_value into /app/lens due to that useSyncToUrl hook

[elasticmachine]

Pinging @elastic/kibana-visualizations (Team:Visualizations)

[elasticmachine]

Pinging @elastic/security-solution (Team: SecuritySolution)

[dej611]

From my investigation you reported above it seems the problem is not due to Lens rather to some code that belongs to @elastic/security-solution . I'll remove the Visualizations tag

[angorayc]

Root cause:
#166686 (comment)

[elasticmachine]

Pinging @elastic/security-threat-hunting (Team:Threat Hunting)