# AUR5001

## Error Message

`AUR5001: The config callback did not return a valid HttpClientConfiguration like instance. Received {{value}}`

Where `{{value}}` is the actual value that was returned from the configuration callback.

## Description

This error occurs when the configuration callback passed to `HttpClient.configure()` returns something other than a valid `HttpClientConfiguration` instance. The configure method expects the callback to return the configuration object to enable method chaining.

## Common Scenarios

### Forgetting to Return Configuration

```typescript
import { HttpClient } from '@aurelia/fetch-client';

const client = new HttpClient();

// ❌ Wrong: Not returning the config
client.configure(config => {
  config.withBaseUrl('https://api.example.com');
  // Missing return statement - this will throw AUR5001
});
```

### Returning Wrong Value

```typescript
// ❌ Wrong: Returning something else
client.configure(config => {
  config.withBaseUrl('https://api.example.com');
  return 'done'; // This will throw AUR5001
});
```

### Async Configuration Mistakes

```typescript
// ❌ Wrong: Returning a Promise instead of config
client.configure(async config => {
  await someAsyncOperation();
  config.withBaseUrl('https://api.example.com');
  return config; // This returns Promise<HttpClientConfiguration>, not HttpClientConfiguration
});
```

## Solutions

### 1. **Always Return the Configuration Object**

```typescript
import { HttpClient } from '@aurelia/fetch-client';

const client = new HttpClient();

// ✅ Correct: Return the config object
client.configure(config => {
  config
    .withBaseUrl('https://api.example.com')
    .withDefaults({
      headers: {
        'Content-Type': 'application/json',
        'Authorization': 'Bearer token'
      }
    });
  
  return config; // Important: return the config
});
```

### 2. **Use Method Chaining (No Return Needed)**

```typescript
// ✅ Correct: Method chaining automatically returns config
client.configure(config => 
  config
    .withBaseUrl('https://api.example.com')
    .withDefaults({
      headers: { 'Content-Type': 'application/json' }
    })
    .withInterceptor({
      request(request) {
        console.log('Making request:', request.url);
        return request;
      }
    })
);
```

### 3. **Handling Async Configuration**

If you need async configuration, handle it outside the configure callback:

```typescript
// ✅ Correct: Handle async operations outside configure
async function setupHttpClient() {
  const apiConfig = await loadApiConfiguration();
  
  return client.configure(config => 
    config
      .withBaseUrl(apiConfig.baseUrl)
      .withDefaults({
        headers: apiConfig.defaultHeaders
      })
  );
}
```

### 4. **Complex Configuration with Helper Functions**

```typescript
function createAuthInterceptor(token: string) {
  return {
    request(request: Request) {
      request.headers.set('Authorization', `Bearer ${token}`);
      return request;
    }
  };
}

// ✅ Correct: Return the config after all operations
client.configure(config => {
  config.withBaseUrl('https://api.example.com');
  
  if (userToken) {
    config.withInterceptor(createAuthInterceptor(userToken));
  }
  
  return config; // Always return config
});
```

## Example: Complete Configuration

```typescript
import { HttpClient } from '@aurelia/fetch-client';
import { autoinject } from '@aurelia/kernel';

@autoinject
export class ApiService {
  constructor(private http: HttpClient) {
    this.configureHttpClient();
  }
  
  private configureHttpClient() {
    this.http.configure(config => {
      return config
        .withBaseUrl('https://api.example.com')
        .withDefaults({
          credentials: 'same-origin',
          headers: {
            'Accept': 'application/json',
            'X-Requested-With': 'Fetch'
          }
        })
        .withInterceptor({
          request(request) {
            console.log(`Requesting ${request.method} ${request.url}`);
            return request;
          },
          response(response) {
            console.log(`Received ${response.status} ${response.url}`);
            return response;
          }
        });
    });
  }
}
```

## Debugging Tips

1. **Check Return Statement**: Ensure your configuration callback returns the `config` parameter
2. **Avoid Async Callbacks**: The configure callback should be synchronous
3. **Use Method Chaining**: Leverages the fluent API and automatically returns the config
4. **TypeScript Helps**: Use TypeScript to catch return type mismatches at compile time


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.aurelia.io/developer-guides/error-messages/5000-to-5008/aur5001.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.