How to fetch a second API based on the response of a first API?

I don't understand why my C# code isn't working.

Basically I want to fetch a URL, and once I get the response I want to use that reponse and fetch another URL.

For this, I have two methods:

TestSuiteModel TestSuites;
public async Task GetTestSuites()
{

    string url = "https://dev.azure.com/XXX/_apis/test/Plans/12/suites?api-version=5.0";
    TestSuites = await TestSuiteService.GetTestSuites(url);


    if(TestSuites != null)
    {
        foreach (var ts in TestSuites.value)
        {
            await this.GetTestCasess(ts.url); 
        }
    }
}

TestCasesModel TestCases; 
private async Task GetTestCasess(string url)
{
    TestCases = await TestCasesService.GetTestCases(url);
}

and then I try to render the result like this:

@if(TestSuites != null)
{
<ul>
    @foreach (var ts in TestSuites.value)
    {
        <li> @ts.name </li>
    }
</ul>
}



@if (TestCases.value != null)
{
    <ul>
        @foreach (var ts in TestCases.value)
        {
             <li> @ts.testCase.webUrl </li>
        }
    </ul>
}

The first foreach works, but the second one throws this error:

> System.NullReferenceException: 'Object reference not set to an
> instance of an object.'
>
> TestCases was null.

It is always the same error no matter how re-write the logic.

The second URL has no issues.

Basically there is no issues with the URLs, Models, Services. The problem has something to do with async/await I haven't figured out yet.

For context, this is how I am calling my Models, Services and OnInitializedAsync

@page "/"; 


@using BlazorTest.Models.TestSuiteModel; 
@using BlazorTest.Models.TestCasesModel;

@inject BlazorTest.Services.TestSuiteService TestSuiteService;
@inject BlazorTest.Services.TestCasesService TestCasesService;

protected override async Task OnInitializedAsync()
{

    await this.GetTestSuites();
    await base.OnInitializedAsync();

}

> I assume, the error is not relevant to any requests or specific logic

Error message is:

> System.NullReferenceException: 'Object reference not set to an instance of an object.'
>
> TestCases was null.

It says: value of the TestCases is null.

It means that you are trying to do something with value of TestCases.

I see this line in your code:

> @if (TestCases.value != null)

You should change it to (notice the ?):

> @if (TestCases?.value != null)

It will check if TestCases is not null or TestCases.value is not null.

> ?. – a null-conditional operator applies a member access operation to its operand only if that operand evaluates to non-null; otherwise, it returns null
>
> https://learn.microsoft.com/en-us/dotnet/csharp/language-reference/operators/member-access-operators#null-conditional-operators--and-

@Vlad DX is correct.

The reason is because the first async call yields thread control back to Component code which runs a render event. At which point TestCases is null.

Here's a minimum reproduction code sample of your issue.

@page "/"

<PageTitle>Index</PageTitle>

<h1>Hello, world!</h1>

Welcome to your new app.

@if(TestSuiteModel is not null)
{
    <div>display</div>
}

@*Will Work*@
@*@if (TestCaseModel?.Value is not null)
{
    <div>display</div>
}
*@

@if (TestCaseModel.Value is not null)
{
    <div>display</div>
}


@code {
    TestSuite? TestSuiteModel;
    TestCase? TestCaseModel;

    protected async override Task OnInitializedAsync()
        => await GetData();

    private async ValueTask GetData()
    {
        // fake an async call to an API/Db
        await Task.Delay(1000);
        // First render of the component occurs here
        TestSuiteModel = new(Enumerable.Empty<string>());
        // fake an async call to an API/Db
        await Task.Delay(1000);
        TestCaseModel = new(Enumerable.Empty<string>());
    }

    public record TestSuite(IEnumerable<string> Value);
    public record TestCase(IEnumerable<string> Value);
}

I'm assuming you either have Nullable disabled on the project or are ignoring the warnings???