diff --git a/cypress/integration/basic.ts b/cypress/integration/basic.ts
index ebd0b98fa6..4997d20a59 100644
--- a/cypress/integration/basic.ts
+++ b/cypress/integration/basic.ts
@@ -18,6 +18,15 @@ describe('basic test', () => {
     cy.location('pathname').should('eq', '/');
   });
 
+  it('updates flamegraph on app name change', () => {
+    cy.visit('/')
+    waitInDevMode(100);
+
+    cy.findByTestId('app-name-selector').select('pyroscope.server.cpu');
+    waitInDevMode(100);
+    cy.findByTestId('flamegraph-canvas').invoke('attr', 'data-appname').should('eq', 'pyroscope.server.cpu{}');
+  });
+
   it('view buttons should change view when clicked', () => {
     cy.visit('/')
     cy.findByTestId('btn-table-view').click();
diff --git a/webapp/__tests__/__snapshots__/NameSelector.spec.js.snap b/webapp/__tests__/__snapshots__/NameSelector.spec.js.snap
index ab8a29a484..fe8d8f1155 100644
--- a/webapp/__tests__/__snapshots__/NameSelector.spec.js.snap
+++ b/webapp/__tests__/__snapshots__/NameSelector.spec.js.snap
@@ -5,6 +5,7 @@ exports[`NameSelector render correctly NameSelector component 1`] = `
   Application: 
   <select
     className="label-select"
+    data-testid="app-name-selector"
     onChange={[Function]}
     value="hotrod.golang.customer"
   >
diff --git a/webapp/javascript/components/FlameGraph/FlameGraphComponent/index.jsx b/webapp/javascript/components/FlameGraph/FlameGraphComponent/index.jsx
index c1da6e9a2e..14d642a267 100644
--- a/webapp/javascript/components/FlameGraph/FlameGraphComponent/index.jsx
+++ b/webapp/javascript/components/FlameGraph/FlameGraphComponent/index.jsx
@@ -549,6 +549,8 @@ class FlameGraph extends React.Component {
             <canvas
               className="flamegraph-canvas"
               height="0"
+              data-testid="flamegraph-canvas"
+              data-appname={this.props.label}
               ref={this.canvasRef}
               onClick={this.clickHandler}
               onMouseMove={this.mouseMoveHandler}
diff --git a/webapp/javascript/components/FlameGraph/FlameGraphComponent/styles.css b/webapp/javascript/components/FlameGraph/FlameGraphComponent/styles.css
index 0161d3f36c..4f5282227a 100644
--- a/webapp/javascript/components/FlameGraph/FlameGraphComponent/styles.css
+++ b/webapp/javascript/components/FlameGraph/FlameGraphComponent/styles.css
@@ -54,7 +54,7 @@
   height: 100%;
   display: flex;
   justify-content: center;
-  align-items: start;
+  align-items: flex-start;
   position: relative;
   padding: 60px 0;
 }
diff --git a/webapp/javascript/components/FlameGraph/FlameGraphRenderer.jsx b/webapp/javascript/components/FlameGraph/FlameGraphRenderer.jsx
index eb8cf38179..a5cb1e5293 100644
--- a/webapp/javascript/components/FlameGraph/FlameGraphRenderer.jsx
+++ b/webapp/javascript/components/FlameGraph/FlameGraphRenderer.jsx
@@ -214,11 +214,7 @@ class FlameGraphRenderer extends React.Component {
           format={this.parseFormat(this.state.flamebearer.format)}
           view={this.state.view}
           ExportData={ExportData}
-          label={
-            this.props.labels
-              ? this.props.labels.filter((x) => x.name === "__name__")[0].value
-              : ""
-          }
+          label={this.props.query}
         />
       ) : null;
 
diff --git a/webapp/javascript/components/NameSelector.jsx b/webapp/javascript/components/NameSelector.jsx
index aad71ef5fd..422d0d0462 100644
--- a/webapp/javascript/components/NameSelector.jsx
+++ b/webapp/javascript/components/NameSelector.jsx
@@ -20,6 +20,7 @@ function NameSelector(props) {
       Application:&nbsp;
       <select
         className="label-select"
+        data-testid="app-name-selector"
         value={defaultValue}
         onChange={selectAppName}
       >