DDC issue main method not called

agPublicVoid commented 3 years ago

Dart SDK Version (dart --version) Dart SDK version: 2.12.0-29.10.beta, Dart SDK version: 2.10.4 - tested using these dart sdks.
Whether you are using Windows, MacOSX, or Linux (if applicable) - macOS Catalina, 10.15.7
Whether you are using Chrome, Safari, Firefox, Edge (if applicable)- tested in all browsers, including safari and Firefox. Chrome version = 87.0.4

main.dart has following code:

import 'package:angular/angular.dart';
import 'package:angular_router/angular_router.dart';
import 'main.template.dart' as self;
import 'package:company/app_component.template.dart' as ng;

@GenerateInjector([
  routerProvidersHash, 
])
final InjectorFactory injector = self.injector$Injector;

void main() {
  print(" in main 25 "); // main method never executed
   runApp(ng.AppComponentNgFactory, createInjector: injector); // this line never executed, neither
}

app_component.dart:

import 'package:angular/angular.dart';
import 'package:angular_router/angular_router.dart';

@Component(
    selector: 'infapp',
    templateUrl: 'app_component.html',
    directives: const [
      coreDirectives,
      routerDirectives,
    ],
)
class AppComponent  {
  AppComponent(Router router)  {
    print("AppComponent called ... "); // never executed
  }
}

index.html:

<!DOCTYPE html>
<html>
  <head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta charset="utf-8"/>
    <link rel="icon" type="image/ico" href="img/icons/favicon.ico">
    <title>company</title>
    <script>
      (function () {
        var m = document.location.pathname.match(/^(\/[-\w]+)+\/web($|\/)/);
        document.write('<base href="' + (m ? m[0] : '/') + '" />');
      }());
    </script>
    <script defer src="main.dart.js"></script>
  </head>
  <body>
    <infapp>
      <div class="container">
        <div class="col-xs-12 col-sm-6 col-md-3 mx-auto pt-5">
          <div class="card">
            <div class="card-body">
              <h4 class="text-center">
                Loading...<br>
                Please Wait
              </h4>
            </div>
          </div>
        </div>
      </div>
    </infapp>
  </body>
</html>

pubsec.yaml

name: company
description: company
version: 0.0.1
environment:
  sdk: '>=2.10.0 <=3.0.0'
dependencies:
  angular: ^6.0.1
  angular_forms: ^3.0.0
  angular_router: ^2.0.0
  http: ^0.12.2
  stream_transform: ^1.2.0
  uuid: ^2.2.2
  json_annotation: ^3.1.0
  bootstrap_sass: ^4.5.0
  angular_components: ^1.0.2
dev_dependencies:
  sass_builder: ^2.1.3
  json_serializable: ^3.5.0
  build_runner: ^1.10.9
  build_web_compilers: ^2.15.1

Command used to run the app with ddc compiler: pub global run webdev serve --debug -v

It compiles fine, no errors, but when navigating to http://localhost:8080, only index.html content is displayed, AppComponent component never instantiated, nor main method of main.dart called . Only one warning in a chrome developer console:

DevTools failed to load SourceMap: Could not load content for http://127.0.0.1:8080/packages/build_web_compilers/src/dev_compiler_stack_trace/stack_trace_mapper.dart.js.map: HTTP error: status code 404, net::ERR_HTTP_RESPONSE_CODE_FAILURE

When running dart2js compiler, app behaves correctly, and AppComponent is loaded: pub global run webdev serve --release -v

As another example, I have tested this issue with sample TOH at: https://github.com/angular-examples/quickstart/tree/master too

After fixing few dependencies, app could build, not able to run it with ddc compiler, only with dart2js.

Note: There is no build.yaml in a project sources.

1) Why is main.dart main method never executes ? 2) Why is AppComponent constructor never gets called ? 3) What am I doing wrong ? :)

Thank you

lejard-h commented 3 years ago

I cloned https://github.com/angular-examples/quickstart/tree/master ran webdev serve and it worked.

Did you manage to make it works ?

agPublicVoid commented 3 years ago

It appeared to be a problem with permissions.

Running application with:

sudo pub global run webdev serve web:8081 --auto=refresh --debug creates .dart_tool/webdev folder and starts a web browser.

Checking audit logs, there were permissions denied errors found to create .dart_tool/webdev folder. Running command with sudo privileges solved a problem. However non of the other other folders under .dart_tool/webdev folder require sudo permissions

Also, if a new browser window is opened, main method is not loaded, again.

I will close this issue, since it is now tracked at: https://github.com/dart-lang/webdev/issues/1216

Thank you!

angulardart / angular

DDC issue main method not called #1940