AWSHttpRequest body not showing in Dart's dev tools

[livioschlaepfer]

Description

Using AWSHttpRequest from package aws_common fails to create a request body on web.
See attached screenshots of created request mobile vs web.

Categories

• Analytics
• API (REST)
• API (GraphQL)
• Auth
• Authenticator
• DataStore
• Notifications (Push)
• Storage

Steps to Reproduce

1. Create an AWSHttpRequest

 final request = AWSHttpRequest.post(
       Uri.parse('<your-url>'),
       headers: const {
         AWSHeaders.contentType: 'application/json',
       },
       body: json.encode({
         'first_name': 'max',
         'last_name': 'muster',
       }).codeUnits,
     );

2. Compare created request on mobile and web

Screenshots

Generated request object on web:

Generated request object on mobile:

Platforms

• iOS
• Android
• Web
• macOS
• Windows
• Linux

Flutter Version

3.16.8

Amplify Flutter Version

aws_common: 0.6.3

Deployment Method

Amplify CLI

Schema

No response

[khatruong2009]

Hi @livioschlaepfer, we will take a look at this issue and get back to you when we have an update.

[livioschlaepfer]

@khatruong2009 are there any updates on this?

[Jordan-Nelson]

@livioschlaepfer I am not able to reproduce the exact issue you are facing. I see there is a body on both web and mobile. The body doesn't seem to display correctly in Dart's dev tools when running on web (see screenshot below).

However, the body is present. I can listen to it an receive data (see code snippet below). I also see the body in Chrome's dev tools when I make the request. I am unsure why it is not displaying correctly in Dart's dev tools. This maybe be an issue with Dart's dev tools.

Is the issue you are facing consistent with what I have described?

Here is the code snippet I was using:

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(),
        body: Center(
          child: Column(
            children: [
              FilledButton(
                onPressed: () {
                  final request = AWSHttpRequest.post(
                    Uri.parse('https://jsonplaceholder.typicode.com/posts'),
                    headers: const {
                      AWSHeaders.contentType: 'application/json; charset=UTF-8',
                    },
                    body: jsonEncode({
                      'title': 'foo',
                      'body': 'bar',
                      'userId': 1,
                    }).codeUnits,
                  );
                  request.body.listen((data) => safePrint('got data: $data'));
                  safePrint('body: ${request.body}');
                  request.send();
                },
                child: const Text('request'),
              ),
            ],
          ),
        ),
      ),
    );
  }

[Jordan-Nelson]

@livioschlaepfer if you are not seeing the value at all it is likely because you have the following dart settings disabled: Show Getters In Debug Views. You can follow this comment to enable/disable it.

[Jordan-Nelson]

I created a minimal reproduction of this and opened an issue here. This seems like a dart issue to me but maybe it is intentional that this is not supported. Either way I don't think it is a bug in amplify_common. I am going to update this to a question for now.

[Jordan-Nelson]

@livioschlaepfer - I am going to close this out now that there is an issue open with dart. It looks like they need to investigate if this can be supported on web. I don't think there is much we can do in amplify flutter.