Safe guard performance bar initialization

On certain pages, where the performance bar isn't loaded, the
initialization will error out.

app/assets/javascripts/performance_bar/index.js

@@ -5,14 +5,15 @@ import axios from '~/lib/utils/axios_utils';
 import PerformanceBarService from './services/performance_bar_service';
 import PerformanceBarStore from './stores/performance_bar_store';
 
-const initPerformanceBar = ({ container }) =>
-  new Vue({
-    el: container,
+const initPerformanceBar = el => {
+  const performanceBarData = el.dataset;
+
+  return new Vue({
+    el,
     components: {
       PerformanceBarApp: () => import('./components/performance_bar_app.vue'),
     },
     data() {
-      const performanceBarData = document.querySelector(this.$options.el).dataset;
       const store = new PerformanceBarStore();
 
       return {
@@ -118,9 +119,13 @@ const initPerformanceBar = ({ container }) =>
       });
     },
   });
+};
 
 document.addEventListener('DOMContentLoaded', () => {
-  initPerformanceBar({ container: '#js-peek' });
+  const jsPeek = document.querySelector('#js-peek');
+  if (jsPeek) {
+    initPerformanceBar(jsPeek);
+  }
 });
 
 export default initPerformanceBar;

spec/frontend/performance_bar/index_spec.js

@@ -44,7 +44,7 @@ describe('performance bar wrapper', () => {
       {},
     );
 
-    vm = performanceBar({ container: '#js-peek' });
+    vm = performanceBar(peekWrapper);
   });
 
   afterEach(() => {