ARC won't load on Firefox 38.0.5

Question

I'm trying to load arc from the Strongloop API. But it fails to load. I've created my DB and retrieved datas from it but The arc HTML page gives me the following error:

Error: [$injector:modulerr] Failed to instantiate module Arc due to: >[$injector:modulerr] Failed to instantiate module Metrics due to: [$injector:nomod] Module 'Metrics' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument. http://errors.angularjs.org/1.3.16/$injector/nomod?p0=Metrics minErr/<@http://localhost:60261/scripts/vendor/angular/angular.js:63:12 module/<@http://localhost:60261/scripts/vendor/angular/angular.js:1778:1 ensure@http://localhost:60261/scripts/vendor/angular/angular.js:1702:38 module@http://localhost:60261/scripts/vendor/angular/angular.js:1776:1 loadModules/<@http://localhost:60261/scripts/vendor/angular/angular.js:4131:22 forEach@http://localhost:60261/scripts/vendor/angular/angular.js:326:11 loadModules@http://localhost:60261/scripts/vendor/angular/angular.js:4115:5 loadModules/<@http://localhost:60261/scripts/vendor/angular/angular.js:4132:40 forEach

<!DOCTYPE html>
<html>
<head>
  <title>StrongLoop Arc</title>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">

  <link rel="stylesheet" type="text/css" href="./style/ng-grid.min.css">
  <link rel="stylesheet" type="text/css" href="./style/jquery-ui.css">
  <link rel="stylesheet" type="text/css" href="./style/jquery.contextMenu.css">
  <link rel="stylesheet" type="text/css" href="./style/bootstrap.css">
  <link rel="stylesheet" type="text/css" href="./style/style.css">
  <!--<link rel="stylesheet" type="text/css" href="./style/src/explorer.css">-->

</head>
<body ng-app="Arc" ng-controller="ArcMainController" ng-click="pageClick($event)"
  class="ui-theme">

<div class="headerContainer" data-id="AppHeaderContainer">
  <div class="branding">
    <a ui-sref="home"><img src="./images/strongloop.svg" alt="Strongloop logo" class="logo"></a>
  </div>
  <sl-app-selector></sl-app-selector>
  <div class="navButtons">
    <ul>
      <li ng-show="isAuthUser()">
        <div sl-pm-app-controller-menu class="header-pm-app-control-menu-item"></div>
      </li>
      <li class="header-help-container" ng-show="helpId">
        <sl-popover-help name="{{helpId}}" position="left" iconclass="icon icon-documentation"></sl-popover-help>
      </li>
      <li>
          <span class="dropdown" dropdown on-toggle="toggled(open)" data-id="ArcAccountDropdown" title="logout">
            <a href class="dropdown-toggle" dropdown-toggle><i class="icon icon-menu"></i></a>
            <ul class="dropdown-menu" dropdown-menu>
              <li lb-login-nav-item></li>
              <li sl-user-logout-nav-item></li>
              <li lb-register-nav-item></li>
              <li><a ui-sref="licenses">licenses</a></li>
            </ul>
          </span>
      </li>
    </ul>
  </div>
  <div class="header-version"></div>

</div>

<sl-message-global></sl-message-global>
<div ui-view autoscroll="false" class="app-module-container"></div>

<!-- growl notification placeholder -->
<div growl></div>

<!-- version injector (display the version ASAP) -->
<script src="./scripts/version.js"></script>

<!-- jquery -->
<script src="./scripts/vendor/jquery/dist/jquery.js"></script>
<script src="./scripts/vendor/jquery-ui/jquery-ui.js"></script>
<script src="./scripts/lib/jquery/jquery.contextMenu.js"></script>
<!--<script src="./scripts/vendor/jQuery-contextMenu/src/jquery.contextMenu.js"></script>-->
<script src="./scripts/vendor/jquery.transit/jquery.transit.js"></script>

<!-- angular -->
<script src="./scripts/vendor/angular/angular.js"></script>
<script src="./scripts/vendor/lodash/lodash.js"></script>

<!-- react -->
<script src="./scripts/vendor/react/react-with-addons.js"></script>

<!-- d3 -->
<script src="./scripts/modules/tracing/tracing.viz.module.js"></script>

<script src="./scripts/vendor/d3/d3.js"></script>
<script src="./scripts/vendor/d3-tip/index.js"></script>

<!-- nvd3 -->
<script src="./scripts/vendor/nvd3/build/nv.d3.js"></script>

<!-- string -->
<script src="./scripts/vendor/stringjs/dist/string.js"></script>

<!-- inflection -->
<script src="./scripts/vendor/inflection/lib/inflection.js"></script>

<!-- chance -->
<script src="./scripts/vendor/chance/chance.js"></script>

<!-- spin -->
<script src="./scripts/vendor/spin.js/spin.js"></script>

<!-- moment -->
<script src="./scripts/vendor/moment/moment.js"></script>
<script src="./scripts/vendor/angular-moment/angular-moment.js"></script>

<!-- tracing vendor -->
<script src="./scripts/vendor/numeraljs/numeral.js"></script>
<script src="./scripts/lib/tracing/pretty.js"></script> <!-- ./lib -->

<!-- lb services -->
<script src="./scripts/modules/common/workspace.services.js"></script>
<script src="./scripts/modules/common/lb-build.js"></script>
<script src="./scripts/modules/common/arc-services.js"></script>

<!-- angular plugins and directives -->
<script src="./scripts/vendor/angular-ui-utils/ui-utils.js"></script>
<script src="./scripts/vendor/ng-file-upload/ng-file-upload.js"></script>
<script src="./scripts/vendor/ng-file-upload-shim/ng-file-upload-shim.js"></script>
<!--<script src="./scripts/modules/common/pm-services.js"></script>-->
<script src="./scripts/vendor/angular-ui-slider/src/slider.js"></script>
<script src="./scripts/vendor/angular-nvd3/dist/angular-nvd3.js"></script>
<script src="./scripts/vendor/angular-cookies/angular-cookies.js"></script>
<script src="./scripts/vendor/angular-animate/angular-animate.js"></script>
<script src="./scripts/vendor/angular-ui-router/release/angular-ui-router.js"></script>
<script src="./scripts/vendor/angular-touch/angular-touch.js"></script>
<script src="./scripts/vendor/angular-spinner/angular-spinner.js"></script>
<script src="./scripts/vendor/angular-sanitize/angular-sanitize.js"></script>
<script src="./scripts/vendor/ng-grid/build/ng-grid.js"></script>
<script src="./scripts/lib/angular/ng-grid-flexible-height.js"></script>
<script src="./scripts/vendor/checklist-model/checklist-model.js"></script>
<script src="./scripts/vendor/angular-bootstrap/ui-bootstrap.js"></script>
<script src="./scripts/vendor/angular-bootstrap/ui-bootstrap-tpls.js"></script>
<script src="./scripts/vendor/angular-resource/angular-resource.js"></script>
<script src="./scripts/vendor/angular-growl/build/angular-growl.js"></script>
<script src="./scripts/vendor/angular-file-upload/angular-file-upload.js"></script>
<script src="./scripts/vendor/ng-clip/dest/ng-clip.min.js"></script>
<script src="./scripts/vendor/zeroclipboard/dist/ZeroClipboard.js"></script>

<!-- sl ui -->
<script src="./scripts/sl.ui.js"></script>
<script src="./scripts/modules/ui/ui.module.js"></script>
<script src="./scripts/modules/ui/ui.directives.js"></script>

<!-- arc -->
<script src="./scripts/modules/arc/arc.module.js"></script>
<script src="./scripts/modules/arc/arc.controllers.js"></script>
<script src="./scripts/modules/arc/arc.directives.js"></script>
<script src="./scripts/modules/arc/arc.services.js"></script>
<script src="./scripts/modules/arc/arc.react.js"></script>

<!-- composer -->
<script src="./scripts/modules/composer/composer.module.js"></script>
<script src="./scripts/modules/composer/composer.controllers.js"></script>
<script src="./scripts/modules/composer/composer.directives.js"></script>
<script src="./scripts/modules/composer/composer.services.js"></script>
<script src="./scripts/modules/composer/composer.react.js"></script>


<!-- build-deploy -->
<script src="./scripts/modules/build-deploy/build-deploy.module.js"></script>
<script src="./scripts/modules/build-deploy/build-deploy.controllers.js"></script>
<script src="./scripts/modules/build-deploy/build-deploy.directives.js"></script>
<script src="./scripts/modules/build-deploy/build-deploy.services.js"></script>

<!-- common -->
<script src="./scripts/modules/common/common.module.js"></script>
<script src="./scripts/modules/common/common.react.js"></script>
<script src="./scripts/modules/common/common.controllers.js"></script>
<script src="./scripts/modules/common/common.directives.js"></script>
<script src="./scripts/modules/common/common.services.js"></script>
<script src="./scripts/modules/common/common.filters.js"></script>
<script src="./scripts/modules/common/common.factories.js"></script>


<!-- profiler -->
<script src="./scripts/modules/profiler/profiler.module.js"></script>
<script src="./scripts/modules/profiler/profiler.controllers.js"></script>
<script src="./scripts/modules/profiler/profiler.directives.js"></script>
<script src="./scripts/modules/profiler/profiler.services.js"></script>

<!-- arc-user -->
<script src="./scripts/modules/arc-user/arc-user.module.js"></script>
<script src="./scripts/modules/arc-user/arc-user.controllers.js"></script>
<script src="./scripts/modules/arc-user/arc-user.services.js"></script>
<script src="./scripts/modules/arc-user/arc-user.react.js"></script>
<script src="./scripts/modules/arc-user/arc-user.directives.js"></script>
<script src="./scripts/modules/arc-user/arc-user.auth.factory.js"></script>

<!-- model -->
<script src="./scripts/modules/model/model.module.js"></script>
<script src="./scripts/modules/model/model.react.js"></script>
<script src="./scripts/modules/model/model.controllers.js"></script>
<script src="./scripts/modules/model/model.services.js"></script>
<script src="./scripts/modules/model/model.directives.js"></script>

<!-- datasource -->
<script src="./scripts/modules/datasource/datasource.module.js"></script>
<script src="./scripts/modules/datasource/datasource.react.js"></script>
<script src="./scripts/modules/datasource/datasource.controllers.js"></script>
<script src="./scripts/modules/datasource/datasource.services.js"></script>
<script src="./scripts/modules/datasource/datasource.directives.js"></script>

<!-- ia -->
<script src="./scripts/modules/ia/ia.module.js"></script>
<script src="./scripts/modules/ia/ia.react.js"></script>
<script src="./scripts/modules/ia/ia.controllers.js"></script>
<script src="./scripts/modules/ia/ia.services.js"></script>
<script src="./scripts/modules/ia/ia.directives.js"></script>

<!-- pm -->
<script src="./scripts/modules/pm/pm.module.js"></script>
<script src="./scripts/modules/pm/pm.controllers.js"></script>
<script src="./scripts/modules/pm/pm.services.js"></script>
<script src="./scripts/modules/pm/pm.directives.js"></script>

<!-- property -->
<script src="./scripts/modules/property/property.module.js"></script>
<script src="./scripts/modules/property/property.react.js"></script>
<script src="./scripts/modules/property/property.controllers.js"></script>
<script src="./scripts/modules/property/property.services.js"></script>
<script src="./scripts/modules/property/property.directives.js"></script>

<!-- explorer -->
<script src="./scripts/modules/explorer/explorer.module.js"></script>
<!--
<script src="./scripts/modules/explorer/explorer.react.js"></script>
<script src="./scripts/modules/explorer/explorer.controllers.js"></script>
-->
<script src="./scripts/modules/explorer/explorer.services.js"></script>
<!--
<script src="./scripts/modules/explorer/explorer.directives.js"></script>
-->

<!-- landing -->
<script src="./scripts/modules/landing/landing.module.js"></script>
<script src="./scripts/modules/landing/landing.services.js"></script>
<script src="./scripts/modules/landing/landing.controllers.js"></script>
<script src="./scripts/modules/landing/landing.directives.js"></script>

<!-- metrics -->
<script src="./scripts/modules/metrics/metrics.module.js"></script>
<script src="./scripts/modules/metrics/metrics.services.js"></script>
<script src="./scripts/modules/metrics/metrics.controllers.js"></script>
<script src="./scripts/modules/metrics/metrics.react.js"></script>
<script src="./scripts/modules/metrics/metrics.directives.js"></script>

<!-- manager -->
<script src="/manager/client.js"></script>
<script src="./scripts/modules/manager/manager.module.js"></script>
<script src="./scripts/modules/manager/manager.services.js"></script>
<script src="./scripts/modules/manager/manager.controllers.js"></script>
<script src="./scripts/modules/manager/manager.directives.js"></script>

<!-- tracing -->
<!--<script src="./scripts/modules/tracing/tracing.viz.module.js"></script>-->
<script src="./scripts/modules/tracing/tracing.module.js"></script>
<script src="./scripts/modules/tracing/tracing.services.js"></script>
<script src="./scripts/modules/tracing/tracing.controllers.js"></script>
<script src="./scripts/modules/tracing/tracing.directives.js"></script>


<!-- discovery -->
<script src="./scripts/modules/discovery/discovery.module.js"></script>
<script src="./scripts/modules/discovery/discovery.controllers.js"></script>
<script src="./scripts/modules/discovery/discovery.services.js"></script>
<script src="./scripts/modules/discovery/discovery.directives.js"></script>

<!-- styleguide -->
<script src="./scripts/modules/styleguide/styleguide.module.js"></script>
<script src="./scripts/modules/styleguide/styleguide.services.js"></script>
<script src="./scripts/modules/styleguide/styleguide.directives.js"></script>
<script src="./scripts/modules/styleguide/styleguide.controllers.js"></script>

<!-- licensing -->
<script src="./scripts/modules/licenses/licenses.module.js"></script>
<script src="./scripts/modules/licenses/licenses.services.js"></script>
<!--<script src="./scripts/modules/licenses/licenses.directives.js"></script>-->
<script src="./scripts/modules/licenses/licenses.controllers.js"></script>

<!-- API analytics -->
<script src="./scripts/modules/api-analytics/api.analytics.module.js"></script>
<script src="./scripts/modules/api-analytics/api.analytics.controllers.js"></script>
<script src="./scripts/modules/api-analytics/api.analytics.directives.js"></script>
<script src="./scripts/modules/api-analytics/api.analytics.services.js"></script>


<!-- angular-segmentio -->
<script src="./scripts/vendor/angular-segmentio/angular-segmentio.js"></script>

<!-- segment.io -->
<script src="./scripts/lib/segmentio/segmentio.js"></script>


</body>
</html>

I've installed strong-arc via npm doing as so:

npm install strong-arc

What can I do?

Thanks in advance for your feedback,

Check your log for JS errors and that all your angular module dependencies are loaded. — Michael, Jun 18 '15 at 07:19
This is my JS log. My angular.js is installed with NPM. I can't see what I cold install? Thanks Michael — JSmith, Jun 18 '15 at 07:44
Can you show the angular module dependencies? Which other JS libraries do you load and in which order? — Michael, Jun 18 '15 at 07:49
not I need to see how you initialize all your angular modules. look for `angular.module(...)` in your code. I also need to see the JS libraries your application is loading. All ` — Michael, Jun 18 '15 at 08:01
I have a lot of script elements in my html file. The thing is that arc is an already build interface so I don't know what to show you as I'm new to MVC — JSmith, Jun 18 '15 at 08:09
Ok, this is quiet a complex scenario. I assume the `Metrics` module is defined in the `metrics.module.js`. Try to remove the module and test if the application starts. Maybe there is a syntax error in the metrics module or one of its dependencies. — Michael, Jun 18 '15 at 08:22
I can't find this module but here is a link that might help you .https://docs.angularjs.org/error/$injector/nomod?p0=Metrics. Thx Again — JSmith, Jun 18 '15 at 08:27
There IS a 'Metrics' module, it is defined as a dependency in one or the other sub modules. Angular tries to load it, but can't find it or it has initialization errors. Obviously Angular you're not working with angular very long - maybe you should start with smaller projects. — Michael, Jun 18 '15 at 08:34
yes i'm new to Angular. But your right I can't find the metric module I'll try clone it from the git repo. It's just I've done what it was told on the website this should work. Thx — JSmith, Jun 18 '15 at 08:38
thanks again for your help Michael, I've edited my post and after installation it's working on Safari and Chrome seems like the error only appears on firefox. Best — JSmith, Jun 18 '15 at 10:45
This question would be better as an issue posted to https://github.com/strongloop/strong-arc/issues — Ryann Graham, Jun 25 '15 at 04:33

score 2 · Accepted Answer · answered Jun 19 '15 at 01:33

2

I resolved the issue by Using Chrome.

answered Jun 19 '15 at 01:33

JSmith

4,519
4
29
45

..and what about IE? – Ceylan Mumun Kocabaş Feb 02 '16 at 13:53
Do you have the same problem? – JSmith Feb 02 '16 at 14:24

ARC won't load on Firefox 38.0.5

1 Answers1