From 5a716e28a8394ef37c25a4dacf147661810656f3 Mon Sep 17 00:00:00 2001 From: Justin Yoo Date: Sun, 18 Aug 2024 12:33:57 +0900 Subject: [PATCH 01/22] Update GHA workflow --- .github/workflows/azure-dev.yml | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/.github/workflows/azure-dev.yml b/.github/workflows/azure-dev.yml index 45dc663d..569c0c35 100644 --- a/.github/workflows/azure-dev.yml +++ b/.github/workflows/azure-dev.yml @@ -24,6 +24,8 @@ jobs: AZURE_ENV_NAME: ${{ vars.AZURE_ENV_NAME }} AZURE_LOCATION: ${{ vars.AZURE_LOCATION }} AZURE_OPENAI_KEYS: ${{ secrets.AZURE_OPENAI_KEYS }} + AZURE_KEYVAULT_URI: ${{ secrets.AZURE_KEYVAULT_URI }} + AZURE_KEYVAULT_SECRET_NAME: ${{ vars.AZURE_KEYVAULT_SECRET_NAME }} steps: - name: Checkout @@ -50,7 +52,9 @@ jobs: shell: pwsh run: | $appsettings = Get-Content -Path "./src/AzureOpenAIProxy.ApiApp/appsettings.json" -Raw | ConvertFrom-Json - $appsettings.Azure.OpenAI.Instances = '${{ env.AZURE_OPENAI_KEYS }}' | ConvertFrom-Json + $appsettings.Azure.OpenAI.Instances = @() + $appsettings.Azure.KeyVault.VaultUri = "${{ env.AZURE_KEYVAULT_URI }}" + $appsettings.Azure.KeyVault.SecretName = "${{ env.AZURE_KEYVAULT_SECRET_NAME }}" $appsettings | ConvertTo-Json -Depth 100 | Set-Content -Path "./src/AzureOpenAIProxy.ApiApp/appsettings.json" -Encoding UTF8 -Force - name: Restore NuGet packages From 831c6a100f0cf8b8a4c3e9e6ee3650d3328c34ad Mon Sep 17 00:00:00 2001 From: yj_chun Date: Tue, 20 Aug 2024 15:42:53 +0900 Subject: [PATCH 02/22] =?UTF-8?q?Playground=20project=EC=97=90=20FluentUI?= =?UTF-8?q?=20=ED=8C=A8=ED=82=A4=EC=A7=80=20=EC=B6=94=EA=B0=80=20&=20dropd?= =?UTF-8?q?own=20UI=20=EC=BB=B4=ED=8F=AC=EB=84=8C=ED=8A=B8=20.razor=20?= =?UTF-8?q?=ED=8C=8C=EC=9D=BC=20=EC=83=9D=EC=84=B1?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../AzureOpenAIProxy.PlaygroundApp.csproj | 2 + .../Components/App.razor | 3 + .../UI/DeploymentModelListComponent.razor | 65 +++++++++++++++++++ src/AzureOpenAIProxy.PlaygroundApp/Program.cs | 6 ++ 4 files changed, 76 insertions(+) create mode 100644 src/AzureOpenAIProxy.PlaygroundApp/Components/UI/DeploymentModelListComponent.razor diff --git a/src/AzureOpenAIProxy.PlaygroundApp/AzureOpenAIProxy.PlaygroundApp.csproj b/src/AzureOpenAIProxy.PlaygroundApp/AzureOpenAIProxy.PlaygroundApp.csproj index eca1c41f..ef49ce94 100644 --- a/src/AzureOpenAIProxy.PlaygroundApp/AzureOpenAIProxy.PlaygroundApp.csproj +++ b/src/AzureOpenAIProxy.PlaygroundApp/AzureOpenAIProxy.PlaygroundApp.csproj @@ -12,6 +12,8 @@ + + diff --git a/src/AzureOpenAIProxy.PlaygroundApp/Components/App.razor b/src/AzureOpenAIProxy.PlaygroundApp/Components/App.razor index 975b820e..cef5c576 100644 --- a/src/AzureOpenAIProxy.PlaygroundApp/Components/App.razor +++ b/src/AzureOpenAIProxy.PlaygroundApp/Components/App.razor @@ -18,3 +18,6 @@ + + diff --git a/src/AzureOpenAIProxy.PlaygroundApp/Components/UI/DeploymentModelListComponent.razor b/src/AzureOpenAIProxy.PlaygroundApp/Components/UI/DeploymentModelListComponent.razor new file mode 100644 index 00000000..9094dd68 --- /dev/null +++ b/src/AzureOpenAIProxy.PlaygroundApp/Components/UI/DeploymentModelListComponent.razor @@ -0,0 +1,65 @@ +@using Microsoft.FluentUI.AspNetCore.Components + + + + + + Alabama + Alaska + Arizona + Arkansas + California + Colorado + Connecticut + Delaware + Florida + Georgia + Hawaii + Idaho + Illinois + Indiana + Iowa + Kansas + Kentucky + Louisiana + Maine + Maryland + Massachussets + Michigain + Minnesota + Mississippi + Missouri + Montana + Nebraska + Nevada + New Hampshire + New Jersey + New Mexico + New York + North Carolina + North Dakota + Ohio + Oklahoma + Oregon + Pennsylvania + + + +

+ @if (!string.IsNullOrEmpty(selectValue)) + { +

Selected Value: @selectValue

+ } + else + { +

none

+ } +

+ +@code { + string? selectValue; +} \ No newline at end of file diff --git a/src/AzureOpenAIProxy.PlaygroundApp/Program.cs b/src/AzureOpenAIProxy.PlaygroundApp/Program.cs index 0481d2e2..cb2ce930 100644 --- a/src/AzureOpenAIProxy.PlaygroundApp/Program.cs +++ b/src/AzureOpenAIProxy.PlaygroundApp/Program.cs @@ -1,10 +1,16 @@ using AzureOpenAIProxy.PlaygroundApp.Clients; +using Microsoft.FluentUI.AspNetCore.Components; + using App = AzureOpenAIProxy.PlaygroundApp.Components.App; var builder = WebApplication.CreateBuilder(args); builder.AddServiceDefaults(); +builder.Services.AddHttpClient(); + +// Add services to the FluentUI +builder.Services.AddFluentUIComponents(); // Add services to the container. builder.Services.AddRazorComponents() From 916d068e120dd6c4751527cd55e0054748114950 Mon Sep 17 00:00:00 2001 From: yj_chun Date: Tue, 20 Aug 2024 16:02:53 +0900 Subject: [PATCH 03/22] =?UTF-8?q?Home.razor=EC=97=90=20DeploymentModelList?= =?UTF-8?q?Component=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/AzureOpenAIProxy.PlaygroundApp/Components/Pages/Home.razor | 1 + 1 file changed, 1 insertion(+) diff --git a/src/AzureOpenAIProxy.PlaygroundApp/Components/Pages/Home.razor b/src/AzureOpenAIProxy.PlaygroundApp/Components/Pages/Home.razor index d05c2a66..5f3f3473 100644 --- a/src/AzureOpenAIProxy.PlaygroundApp/Components/Pages/Home.razor +++ b/src/AzureOpenAIProxy.PlaygroundApp/Components/Pages/Home.razor @@ -7,4 +7,5 @@ Welcome to your new app. + \ No newline at end of file From 2b7cd4b954b2f09940d92a557ed7b41443a6b5b4 Mon Sep 17 00:00:00 2001 From: yj_chun Date: Wed, 21 Aug 2024 16:06:46 +0900 Subject: [PATCH 04/22] =?UTF-8?q?DeploymentModelListComponent=EC=97=90=20?= =?UTF-8?q?=EB=8C=80=ED=95=9C=20test=20=EC=BD=94=EB=93=9C=20=ED=8C=8C?= =?UTF-8?q?=EC=9D=BC=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../UI/DeploymentModelListComponent.razor | 19 ++- ...zureOpenAIProxy.PlaygroundApp.Tests.csproj | 16 ++- .../DeploymentModelListComponentTests.cs | 123 ++++++++++++++++++ 3 files changed, 154 insertions(+), 4 deletions(-) create mode 100644 test/AzureOpenAIProxy.PlaygroundApp.Tests/DeploymentModelListComponentTests.cs diff --git a/src/AzureOpenAIProxy.PlaygroundApp/Components/UI/DeploymentModelListComponent.razor b/src/AzureOpenAIProxy.PlaygroundApp/Components/UI/DeploymentModelListComponent.razor index 9094dd68..5e85ddc2 100644 --- a/src/AzureOpenAIProxy.PlaygroundApp/Components/UI/DeploymentModelListComponent.razor +++ b/src/AzureOpenAIProxy.PlaygroundApp/Components/UI/DeploymentModelListComponent.razor @@ -7,8 +7,9 @@ - Alabama + TOption="string" aria-roledescription="combobox" aria-labelledby="deployment-model-list" Height="300px" + Style="margin: 5px;"> + Alabama Alaska Arizona Arkansas @@ -61,5 +62,17 @@

@code { - string? selectValue; + public string? selectValue; + protected void ValueChanged(string value) + { + selectValue = value; + if (!string.IsNullOrEmpty(selectValue)) + { + Console.WriteLine($"Selected Value: {selectValue}"); + } + else + { + Console.WriteLine("none"); + } + } } \ No newline at end of file diff --git a/test/AzureOpenAIProxy.PlaygroundApp.Tests/AzureOpenAIProxy.PlaygroundApp.Tests.csproj b/test/AzureOpenAIProxy.PlaygroundApp.Tests/AzureOpenAIProxy.PlaygroundApp.Tests.csproj index 1a9f53fe..cbcd446b 100644 --- a/test/AzureOpenAIProxy.PlaygroundApp.Tests/AzureOpenAIProxy.PlaygroundApp.Tests.csproj +++ b/test/AzureOpenAIProxy.PlaygroundApp.Tests/AzureOpenAIProxy.PlaygroundApp.Tests.csproj @@ -9,12 +9,25 @@ - + all runtime; build; native; contentfiles; analyzers; buildtransitive + + runtime; build; native; contentfiles; analyzers; buildtransitive + all + + + + + + + runtime; build; native; contentfiles; analyzers; buildtransitive + all + + all @@ -28,6 +41,7 @@ + diff --git a/test/AzureOpenAIProxy.PlaygroundApp.Tests/DeploymentModelListComponentTests.cs b/test/AzureOpenAIProxy.PlaygroundApp.Tests/DeploymentModelListComponentTests.cs new file mode 100644 index 00000000..c189e378 --- /dev/null +++ b/test/AzureOpenAIProxy.PlaygroundApp.Tests/DeploymentModelListComponentTests.cs @@ -0,0 +1,123 @@ +using Microsoft.FluentUI.AspNetCore.Components; +using Microsoft.Extensions.DependencyInjection; +using Microsoft.Playwright.NUnit; +using Microsoft.Playwright; +using Assert = NUnit.Framework.Assert; +using Bunit; +using AzureOpenAIProxy.PlaygroundApp.Components.UI; + + + +namespace AzureOpenAIProxy.PlaygroundApp.Tests +{ + [TestFixture] + public class HomePageTests : PageTest + { + private IPlaywright _playwright; + private IBrowser _browser; + private IBrowserContext _context; + private IPage _page; + + [SetUp] + public async Task Setup() + { + _playwright = await Microsoft.Playwright.Playwright.CreateAsync(); + _browser = await _playwright.Chromium.LaunchAsync(new BrowserTypeLaunchOptions + { + Headless = false // 브라우저를 헤드리스 모드로 실행하지 않으려면 false로 설정 + }); + _context = await _browser.NewContextAsync(); + _page = await _context.NewPageAsync(); + } + + [TearDown] + public async Task Teardown() + { + await _page.CloseAsync(); + await _browser.CloseAsync(); + _playwright.Dispose(); + } + + [SetUp] + public async Task NavigateToHomePage() + { + await _page.GotoAsync("http://localhost:5000"); + await _page.GetByRole(AriaRole.Link, new() { Name = "Home" }).ClickAsync(); + await _page.WaitForLoadStateAsync(LoadState.NetworkIdle); + } + + [Test] + // PlaygroundApp - Home.razor에서 드롭다운의 input 값을 선택하고, 선택된 값이 올바르게 설정되는지 확인 + public async Task ShouldSelectDropdownOption() + { + // Act + await _page.GetByRole(AriaRole.Combobox, new() { Name = "deployment-models" }).ClickAsync(); // 이 부분에서 계속 timeout + Assert.That(await _page.GetByRole(AriaRole.Option, new() { Name = "CA" }).IsVisibleAsync(), Is.True); + + // Assert + // var selectedValue = await dropdown.EvaluateAsync("el => el.value"); + // Assert.That(selectedValue, Is.EqualTo("CA")); + + // if (dropdown == null) + // { + // Assert.Fail("Dropdown element not found"); + // } + // else + // { + // await dropdown.ClickAsync(); + // await dropdown.SelectOptionAsync("CA"); + // } + + // // Assert + // var selectedValue = await dropdown.EvaluateAsync("el => el.value"); + // Assert.That(selectedValue, Is.EqualTo("CA")); + } + } + + public class DeploymentModelListComponentTests : Bunit.TestContext + { + public DeploymentModelListComponentTests() + { + // FluentUI 구성 요소를 위한 LibraryConfiguration 인스턴스 생성 및 등록 + var libraryConfiguration = new LibraryConfiguration(); + Services.AddSingleton(libraryConfiguration); + + // FluentUI 구성 요소 서비스 추가 + Services.AddFluentUIComponents(); + + // JSInterop 설정 + JSInterop.Mode = JSRuntimeMode.Loose; + } + + [Fact] + // 드롭다운이 올바르게 렌더링 되고, 모든 옵션이 표시되는지 확인 + public void ShouldRenderCorrectly() + { + // Arrange & Act + var component = RenderComponent(); + + // Assert + var fluentSelect = component.Find("fluent-select"); + Assert.That(fluentSelect, Is.Not.Null); + + var options = component.FindAll("fluent-option"); + Assert.That(options.Count, Is.EqualTo(38)); // 하드코딩 된 데이터 개수: 38개 + } + + [Fact] + // FluentSelect의 옵션 값이 선택되면 ValueChanged 이벤트가 트리거되고, 선택된 값으로 업데이트되는지 확인 + public void ShouldTriggerValueChanged() + { + // Arrange + var component = RenderComponent(); + var fluentSelect = component.Find("fluent-select"); + + // Act + fluentSelect.Change("CA"); // 하드코딩 된 데이터 중 하나인 'CA'를 선택 + + // Assert + var selectedValue = component.Instance.selectValue; + Assert.That(selectedValue, Is.EqualTo("CA")); + } + } +} \ No newline at end of file From 401853d9892aebcb0867fb18ee65ca7daa17be0d Mon Sep 17 00:00:00 2001 From: yj_chun Date: Wed, 21 Aug 2024 17:10:45 +0900 Subject: [PATCH 05/22] =?UTF-8?q?test=20code=20=ED=8C=8C=EC=9D=BC=20?= =?UTF-8?q?=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../DeploymentModelListComponentTests.cs | 3 --- 1 file changed, 3 deletions(-) diff --git a/test/AzureOpenAIProxy.PlaygroundApp.Tests/DeploymentModelListComponentTests.cs b/test/AzureOpenAIProxy.PlaygroundApp.Tests/DeploymentModelListComponentTests.cs index c189e378..1c2ccfe1 100644 --- a/test/AzureOpenAIProxy.PlaygroundApp.Tests/DeploymentModelListComponentTests.cs +++ b/test/AzureOpenAIProxy.PlaygroundApp.Tests/DeploymentModelListComponentTests.cs @@ -4,9 +4,6 @@ using Microsoft.Playwright; using Assert = NUnit.Framework.Assert; using Bunit; -using AzureOpenAIProxy.PlaygroundApp.Components.UI; - - namespace AzureOpenAIProxy.PlaygroundApp.Tests { From a003f6c704106bc767d9696fa8455f859ef814c4 Mon Sep 17 00:00:00 2001 From: yj_chun Date: Thu, 22 Aug 2024 17:59:59 +0900 Subject: [PATCH 06/22] =?UTF-8?q?DeploymentModelList=20=EC=BB=B4=ED=8F=AC?= =?UTF-8?q?=EB=84=8C=ED=8A=B8=20=ED=8C=8C=EC=9D=BC=20&=20=ED=85=8C?= =?UTF-8?q?=EC=8A=A4=ED=8A=B8=20=EC=BD=94=EB=93=9C=20=ED=8C=8C=EC=9D=BC=20?= =?UTF-8?q?=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../UI/DeploymentModelListComponent.razor | 11 +- .../DeploymentModelListComponentTests.cs | 103 +++++++++++++----- 2 files changed, 81 insertions(+), 33 deletions(-) diff --git a/src/AzureOpenAIProxy.PlaygroundApp/Components/UI/DeploymentModelListComponent.razor b/src/AzureOpenAIProxy.PlaygroundApp/Components/UI/DeploymentModelListComponent.razor index 5e85ddc2..035f9152 100644 --- a/src/AzureOpenAIProxy.PlaygroundApp/Components/UI/DeploymentModelListComponent.razor +++ b/src/AzureOpenAIProxy.PlaygroundApp/Components/UI/DeploymentModelListComponent.razor @@ -1,14 +1,17 @@ +@using AzureOpenAIProxy.PlaygroundApp.Clients @using Microsoft.FluentUI.AspNetCore.Components + TOption="string" aria-labelledby="deployment-model-list" Height="300px"> Alabama Alaska Arizona diff --git a/test/AzureOpenAIProxy.PlaygroundApp.Tests/DeploymentModelListComponentTests.cs b/test/AzureOpenAIProxy.PlaygroundApp.Tests/DeploymentModelListComponentTests.cs index 1c2ccfe1..eac0e051 100644 --- a/test/AzureOpenAIProxy.PlaygroundApp.Tests/DeploymentModelListComponentTests.cs +++ b/test/AzureOpenAIProxy.PlaygroundApp.Tests/DeploymentModelListComponentTests.cs @@ -1,3 +1,4 @@ +using AzureOpenAIProxy.PlaygroundApp.Components.UI; using Microsoft.FluentUI.AspNetCore.Components; using Microsoft.Extensions.DependencyInjection; using Microsoft.Playwright.NUnit; @@ -7,13 +8,15 @@ namespace AzureOpenAIProxy.PlaygroundApp.Tests { + // Playwright 테스트 [TestFixture] - public class HomePageTests : PageTest + public class ComponentIntegraionTests : PageTest { private IPlaywright _playwright; private IBrowser _browser; private IBrowserContext _context; private IPage _page; + private IElementHandle? _fluentSelect; [SetUp] public async Task Setup() @@ -36,41 +39,79 @@ public async Task Teardown() } [SetUp] - public async Task NavigateToHomePage() + public async Task NavigateToTargetPage() { await _page.GotoAsync("http://localhost:5000"); await _page.GetByRole(AriaRole.Link, new() { Name = "Home" }).ClickAsync(); await _page.WaitForLoadStateAsync(LoadState.NetworkIdle); + + // 페이지 초기화 및 fluentSelect 설정 + _fluentSelect = await _page.QuerySelectorAsync("fluent-select#deployment-model-list"); + Assert.That(_fluentSelect, Is.Not.Null); } [Test] - // PlaygroundApp - Home.razor에서 드롭다운의 input 값을 선택하고, 선택된 값이 올바르게 설정되는지 확인 - public async Task ShouldSelectDropdownOption() + // 페이지에서 컴포넌트의 헤딩이 올바르게 표시되는지 확인 + public async Task IsThereAHeading() { // Act - await _page.GetByRole(AriaRole.Combobox, new() { Name = "deployment-models" }).ClickAsync(); // 이 부분에서 계속 timeout - Assert.That(await _page.GetByRole(AriaRole.Option, new() { Name = "CA" }).IsVisibleAsync(), Is.True); + await Expect(_page + .GetByRole(AriaRole.Heading, new() { Name = "Deployment" })) + .ToBeVisibleAsync(); // Assert - // var selectedValue = await dropdown.EvaluateAsync("el => el.value"); - // Assert.That(selectedValue, Is.EqualTo("CA")); - - // if (dropdown == null) - // { - // Assert.Fail("Dropdown element not found"); - // } - // else - // { - // await dropdown.ClickAsync(); - // await dropdown.SelectOptionAsync("CA"); - // } - - // // Assert - // var selectedValue = await dropdown.EvaluateAsync("el => el.value"); - // Assert.That(selectedValue, Is.EqualTo("CA")); + Assert.That(await _page.GetByRole(AriaRole.Heading, new() { Name = "Deployment" }).IsVisibleAsync(), Is.True); + } + + [Test] + // 페이지에서 드롭다운 컴포넌트가 올바르게 표시되는지 확인 + public async Task IsThereADropdownComponent() + { + // fluentSelect 컴포넌트가 페이지에 존재하는지 확인 + Assert.That(_fluentSelect, Is.Not.Null); + await _fluentSelect.ClickAsync(); + + // fluentSelect 컴포넌트의 옵션이 페이지에 표시되는지 확인 + var fluentOptions = await _fluentSelect.QuerySelectorAllAsync("fluent-option"); + Assert.That(fluentOptions.Count, Is.GreaterThan(0)); + foreach (var option in fluentOptions) + { + Assert.That(await option.IsVisibleAsync(), Is.True); + } + } + + [Test] + // 드롭다운의 옵션 값을 선택하고, 선택된 값이 컴포넌트에 올바르게 업데이트 되는지 확인 + public async Task IsDropdownOptionSelectWorking() + { + // Arrange + Assert.That(_fluentSelect, Is.Not.Null); + await _fluentSelect.ClickAsync(); + var fluentOptions = await _fluentSelect.QuerySelectorAllAsync("fluent-option"); + Assert.That(fluentOptions.Count, Is.GreaterThan(0)); + + // Act + var userSelectedOption = fluentOptions[0]; // Select the first option + await userSelectedOption.ClickAsync(); + + await _page.EvaluateAsync(@"() => { + window.selectValue = document.querySelector('fluent-select#deployment-model-list').value; + }"); // Define and set 'selectValue'(Component variable) in the page context + + // Assert + var userSelectedOptionValue = await _fluentSelect.EvaluateAsync("el => el.value"); // Get the selected value + var actualSelectedValue = await _page.EvaluateAsync("() => selectValue"); // Get the selected value from the page context + Assert.That(actualSelectedValue, Is.EqualTo(userSelectedOptionValue)); + } + + [TearDown] + public async Task TearDown() + { + await _page.CloseAsync(); } } + // Bunit 테스트 public class DeploymentModelListComponentTests : Bunit.TestContext { public DeploymentModelListComponentTests() @@ -87,7 +128,7 @@ public DeploymentModelListComponentTests() } [Fact] - // 드롭다운이 올바르게 렌더링 되고, 모든 옵션이 표시되는지 확인 + // 드롭다운이 올바르게 렌더링 되고, 옵션이 표시되는지 확인 public void ShouldRenderCorrectly() { // Arrange & Act @@ -98,23 +139,27 @@ public void ShouldRenderCorrectly() Assert.That(fluentSelect, Is.Not.Null); var options = component.FindAll("fluent-option"); - Assert.That(options.Count, Is.EqualTo(38)); // 하드코딩 된 데이터 개수: 38개 + Assert.That(options.Count, Is.GreaterThan(0)); } [Fact] - // FluentSelect의 옵션 값이 선택되면 ValueChanged 이벤트가 트리거되고, 선택된 값으로 업데이트되는지 확인 + // FluentSelect의 옵션이 선택되면 ValueChanged 이벤트가 트리거되고, 선택된 옵션 값으로 업데이트되는지 확인 public void ShouldTriggerValueChanged() { // Arrange var component = RenderComponent(); - var fluentSelect = component.Find("fluent-select"); + var fluentSelect = component.Find("fluent-select#deployment-model-list"); // Act - fluentSelect.Change("CA"); // 하드코딩 된 데이터 중 하나인 'CA'를 선택 + var fluentOptions = fluentSelect.QuerySelectorAll("fluent-option"); + var actualSelectedValue = fluentOptions[0].GetAttribute("value"); + + // Define and set selectValue in the page context + fluentOptions[0].Click(); // 첫 번째 옵션을 선택 - 여기서 value가 update 되어야 함 + var updatedSelectedValue = component.Instance.selectValue; // Assert - var selectedValue = component.Instance.selectValue; - Assert.That(selectedValue, Is.EqualTo("CA")); + Assert.That(actualSelectedValue, Is.EqualTo(updatedSelectedValue)); } } } \ No newline at end of file From 4427061556fff7b498b4b14e69a3cf81765ec0ff Mon Sep 17 00:00:00 2001 From: yj_chun Date: Thu, 22 Aug 2024 18:26:01 +0900 Subject: [PATCH 07/22] =?UTF-8?q?PackageReference=20=EA=B4=80=EB=A0=A8=20?= =?UTF-8?q?=ED=8C=8C=EC=9D=BC=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- Directory.Build.props | 4 ++++ .../AzureOpenAIProxy.PlaygroundApp.Tests.csproj | 14 +++++++------- 2 files changed, 11 insertions(+), 7 deletions(-) diff --git a/Directory.Build.props b/Directory.Build.props index a3531f4c..fcbee3eb 100644 --- a/Directory.Build.props +++ b/Directory.Build.props @@ -23,5 +23,9 @@ 5.* 8.* 2.* + 1.* + 4.* + 4.* + 4.* diff --git a/test/AzureOpenAIProxy.PlaygroundApp.Tests/AzureOpenAIProxy.PlaygroundApp.Tests.csproj b/test/AzureOpenAIProxy.PlaygroundApp.Tests/AzureOpenAIProxy.PlaygroundApp.Tests.csproj index cbcd446b..58282247 100644 --- a/test/AzureOpenAIProxy.PlaygroundApp.Tests/AzureOpenAIProxy.PlaygroundApp.Tests.csproj +++ b/test/AzureOpenAIProxy.PlaygroundApp.Tests/AzureOpenAIProxy.PlaygroundApp.Tests.csproj @@ -9,21 +9,21 @@ - + all runtime; build; native; contentfiles; analyzers; buildtransitive - + runtime; build; native; contentfiles; analyzers; buildtransitive all - + - - - - + + + + runtime; build; native; contentfiles; analyzers; buildtransitive all From 1b9fc5cdfe456eaa2d066f229ce21466a50d6145 Mon Sep 17 00:00:00 2001 From: yj_chun Date: Thu, 22 Aug 2024 23:17:14 +0900 Subject: [PATCH 08/22] =?UTF-8?q?Test=20code=20(Playwright,=20bUnit)=20?= =?UTF-8?q?=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- ...zureOpenAIProxy.PlaygroundApp.Tests.csproj | 5 ++-- .../DeploymentModelListComponentTests.cs | 25 ++++++++++--------- 2 files changed, 16 insertions(+), 14 deletions(-) diff --git a/test/AzureOpenAIProxy.PlaygroundApp.Tests/AzureOpenAIProxy.PlaygroundApp.Tests.csproj b/test/AzureOpenAIProxy.PlaygroundApp.Tests/AzureOpenAIProxy.PlaygroundApp.Tests.csproj index 6f24e1ca..48f323d8 100644 --- a/test/AzureOpenAIProxy.PlaygroundApp.Tests/AzureOpenAIProxy.PlaygroundApp.Tests.csproj +++ b/test/AzureOpenAIProxy.PlaygroundApp.Tests/AzureOpenAIProxy.PlaygroundApp.Tests.csproj @@ -9,6 +9,7 @@ + all runtime; build; native; contentfiles; analyzers; buildtransitive @@ -28,9 +29,9 @@ - + diff --git a/test/AzureOpenAIProxy.PlaygroundApp.Tests/DeploymentModelListComponentTests.cs b/test/AzureOpenAIProxy.PlaygroundApp.Tests/DeploymentModelListComponentTests.cs index eac0e051..cf721dbe 100644 --- a/test/AzureOpenAIProxy.PlaygroundApp.Tests/DeploymentModelListComponentTests.cs +++ b/test/AzureOpenAIProxy.PlaygroundApp.Tests/DeploymentModelListComponentTests.cs @@ -1,10 +1,10 @@ -using AzureOpenAIProxy.PlaygroundApp.Components.UI; using Microsoft.FluentUI.AspNetCore.Components; using Microsoft.Extensions.DependencyInjection; using Microsoft.Playwright.NUnit; using Microsoft.Playwright; using Assert = NUnit.Framework.Assert; using Bunit; +using AzureOpenAIProxy.PlaygroundApp.Components.UI; namespace AzureOpenAIProxy.PlaygroundApp.Tests { @@ -19,7 +19,7 @@ public class ComponentIntegraionTests : PageTest private IElementHandle? _fluentSelect; [SetUp] - public async Task Setup() + public async Task fieldSetup() { _playwright = await Microsoft.Playwright.Playwright.CreateAsync(); _browser = await _playwright.Chromium.LaunchAsync(new BrowserTypeLaunchOptions @@ -42,7 +42,7 @@ public async Task Teardown() public async Task NavigateToTargetPage() { await _page.GotoAsync("http://localhost:5000"); - await _page.GetByRole(AriaRole.Link, new() { Name = "Home" }).ClickAsync(); + // await _page.GetByRole(AriaRole.Link, new() { Name = "Home" }).ClickAsync(); await _page.WaitForLoadStateAsync(LoadState.NetworkIdle); // 페이지 초기화 및 fluentSelect 설정 @@ -112,6 +112,7 @@ public async Task TearDown() } // Bunit 테스트 + [TestFixture] public class DeploymentModelListComponentTests : Bunit.TestContext { public DeploymentModelListComponentTests() @@ -127,28 +128,28 @@ public DeploymentModelListComponentTests() JSInterop.Mode = JSRuntimeMode.Loose; } - [Fact] + [Test] // 드롭다운이 올바르게 렌더링 되고, 옵션이 표시되는지 확인 public void ShouldRenderCorrectly() { // Arrange & Act - var component = RenderComponent(); + var cut = RenderComponent(); + var fluentSelect = cut.Find("fluent-select#deployment-model-list"); // Assert - var fluentSelect = component.Find("fluent-select"); Assert.That(fluentSelect, Is.Not.Null); - var options = component.FindAll("fluent-option"); - Assert.That(options.Count, Is.GreaterThan(0)); + var fluentOptions = cut.FindAll("fluent-option"); + Assert.That(fluentOptions.Count, Is.GreaterThan(0)); } - [Fact] + [Test] // FluentSelect의 옵션이 선택되면 ValueChanged 이벤트가 트리거되고, 선택된 옵션 값으로 업데이트되는지 확인 public void ShouldTriggerValueChanged() { // Arrange - var component = RenderComponent(); - var fluentSelect = component.Find("fluent-select#deployment-model-list"); + var cut = RenderComponent(); + var fluentSelect = cut.Find("fluent-select#deployment-model-list"); // Act var fluentOptions = fluentSelect.QuerySelectorAll("fluent-option"); @@ -156,7 +157,7 @@ public void ShouldTriggerValueChanged() // Define and set selectValue in the page context fluentOptions[0].Click(); // 첫 번째 옵션을 선택 - 여기서 value가 update 되어야 함 - var updatedSelectedValue = component.Instance.selectValue; + var updatedSelectedValue = cut.Instance.selectValue; // Assert Assert.That(actualSelectedValue, Is.EqualTo(updatedSelectedValue)); From 3f9c2dc867b55f5d90a38b50725408a950d505bf Mon Sep 17 00:00:00 2001 From: yj_chun Date: Thu, 22 Aug 2024 23:20:55 +0900 Subject: [PATCH 09/22] =?UTF-8?q?Playwright=20test=20code=20-=20Headless?= =?UTF-8?q?=20mode=20=EC=84=A4=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../DeploymentModelListComponentTests.cs | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/test/AzureOpenAIProxy.PlaygroundApp.Tests/DeploymentModelListComponentTests.cs b/test/AzureOpenAIProxy.PlaygroundApp.Tests/DeploymentModelListComponentTests.cs index cf721dbe..be47761b 100644 --- a/test/AzureOpenAIProxy.PlaygroundApp.Tests/DeploymentModelListComponentTests.cs +++ b/test/AzureOpenAIProxy.PlaygroundApp.Tests/DeploymentModelListComponentTests.cs @@ -24,7 +24,7 @@ public async Task fieldSetup() _playwright = await Microsoft.Playwright.Playwright.CreateAsync(); _browser = await _playwright.Chromium.LaunchAsync(new BrowserTypeLaunchOptions { - Headless = false // 브라우저를 헤드리스 모드로 실행하지 않으려면 false로 설정 + Headless = true // Integration test를 위해 Headless 모드로 설정 }); _context = await _browser.NewContextAsync(); _page = await _context.NewPageAsync(); From 7cfe09ea0ff7729e8d4d53a5804f1e9677b7063e Mon Sep 17 00:00:00 2001 From: yj_chun Date: Thu, 22 Aug 2024 23:48:36 +0900 Subject: [PATCH 10/22] =?UTF-8?q?Playwright=20test=20code=20=EC=88=98?= =?UTF-8?q?=EC=A0=95=20=EB=B0=8F=20=EC=BB=B4=ED=8F=AC=EB=84=8C=ED=8A=B8=20?= =?UTF-8?q?=ED=85=8C=EC=8A=A4=ED=8A=B8=20=EC=9A=A9=20Tests.razor=20?= =?UTF-8?q?=ED=8E=98=EC=9D=B4=EC=A7=80=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Components/Pages/Home.razor | 1 - .../Components/Pages/Tests.razor | 5 +++++ .../UI/DeploymentModelListComponent.razor | 4 ++-- .../DeploymentModelListComponentTests.cs | 22 +++++++++---------- 4 files changed, 17 insertions(+), 15 deletions(-) create mode 100644 src/AzureOpenAIProxy.PlaygroundApp/Components/Pages/Tests.razor rename test/AzureOpenAIProxy.PlaygroundApp.Tests/{ => UI}/DeploymentModelListComponentTests.cs (95%) diff --git a/src/AzureOpenAIProxy.PlaygroundApp/Components/Pages/Home.razor b/src/AzureOpenAIProxy.PlaygroundApp/Components/Pages/Home.razor index 5f3f3473..d05c2a66 100644 --- a/src/AzureOpenAIProxy.PlaygroundApp/Components/Pages/Home.razor +++ b/src/AzureOpenAIProxy.PlaygroundApp/Components/Pages/Home.razor @@ -7,5 +7,4 @@ Welcome to your new app. - \ No newline at end of file diff --git a/src/AzureOpenAIProxy.PlaygroundApp/Components/Pages/Tests.razor b/src/AzureOpenAIProxy.PlaygroundApp/Components/Pages/Tests.razor new file mode 100644 index 00000000..bf6b4e7d --- /dev/null +++ b/src/AzureOpenAIProxy.PlaygroundApp/Components/Pages/Tests.razor @@ -0,0 +1,5 @@ +@page "/tests" +@using AzureOpenAIProxy.PlaygroundApp.Components.UI +@rendermode InteractiveServer + + \ No newline at end of file diff --git a/src/AzureOpenAIProxy.PlaygroundApp/Components/UI/DeploymentModelListComponent.razor b/src/AzureOpenAIProxy.PlaygroundApp/Components/UI/DeploymentModelListComponent.razor index 035f9152..640d117b 100644 --- a/src/AzureOpenAIProxy.PlaygroundApp/Components/UI/DeploymentModelListComponent.razor +++ b/src/AzureOpenAIProxy.PlaygroundApp/Components/UI/DeploymentModelListComponent.razor @@ -7,7 +7,6 @@ Deployment * - @code { - public string? selectValue; + [Parameter] + public string? selectValue { get; set; } protected void ValueChanged(string value) { selectValue = value; diff --git a/test/AzureOpenAIProxy.PlaygroundApp.Tests/DeploymentModelListComponentTests.cs b/test/AzureOpenAIProxy.PlaygroundApp.Tests/UI/DeploymentModelListComponentTests.cs similarity index 95% rename from test/AzureOpenAIProxy.PlaygroundApp.Tests/DeploymentModelListComponentTests.cs rename to test/AzureOpenAIProxy.PlaygroundApp.Tests/UI/DeploymentModelListComponentTests.cs index be47761b..2aa1b770 100644 --- a/test/AzureOpenAIProxy.PlaygroundApp.Tests/DeploymentModelListComponentTests.cs +++ b/test/AzureOpenAIProxy.PlaygroundApp.Tests/UI/DeploymentModelListComponentTests.cs @@ -10,7 +10,7 @@ namespace AzureOpenAIProxy.PlaygroundApp.Tests { // Playwright 테스트 [TestFixture] - public class ComponentIntegraionTests : PageTest + public class ComponentIntegrationTests : PageTest { private IPlaywright _playwright; private IBrowser _browser; @@ -18,6 +18,11 @@ public class ComponentIntegraionTests : PageTest private IPage _page; private IElementHandle? _fluentSelect; + public override BrowserNewContextOptions ContextOptions() => new() + { + IgnoreHTTPSErrors = true, + }; + [SetUp] public async Task fieldSetup() { @@ -30,19 +35,10 @@ public async Task fieldSetup() _page = await _context.NewPageAsync(); } - [TearDown] - public async Task Teardown() - { - await _page.CloseAsync(); - await _browser.CloseAsync(); - _playwright.Dispose(); - } - [SetUp] public async Task NavigateToTargetPage() { - await _page.GotoAsync("http://localhost:5000"); - // await _page.GetByRole(AriaRole.Link, new() { Name = "Home" }).ClickAsync(); + await _page.GotoAsync("http://localhost:5000/tests"); await _page.WaitForLoadStateAsync(LoadState.NetworkIdle); // 페이지 초기화 및 fluentSelect 설정 @@ -105,9 +101,11 @@ await _page.EvaluateAsync(@"() => { } [TearDown] - public async Task TearDown() + public async Task Teardown() { await _page.CloseAsync(); + await _browser.CloseAsync(); + _playwright.Dispose(); } } From 74c05ca7c000ac482a55ddfcb24e960189e9c3a2 Mon Sep 17 00:00:00 2001 From: yj_chun Date: Fri, 23 Aug 2024 09:47:05 +0900 Subject: [PATCH 11/22] =?UTF-8?q?Playwright=20=EB=A1=9C=EC=BB=AC=20?= =?UTF-8?q?=ED=98=B8=EC=8A=A4=ED=8A=B8=20=EC=A0=91=EC=86=8D=20url=20?= =?UTF-8?q?=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../UI/DeploymentModelListComponentTests.cs | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/test/AzureOpenAIProxy.PlaygroundApp.Tests/UI/DeploymentModelListComponentTests.cs b/test/AzureOpenAIProxy.PlaygroundApp.Tests/UI/DeploymentModelListComponentTests.cs index 2aa1b770..509bd477 100644 --- a/test/AzureOpenAIProxy.PlaygroundApp.Tests/UI/DeploymentModelListComponentTests.cs +++ b/test/AzureOpenAIProxy.PlaygroundApp.Tests/UI/DeploymentModelListComponentTests.cs @@ -6,7 +6,7 @@ using Bunit; using AzureOpenAIProxy.PlaygroundApp.Components.UI; -namespace AzureOpenAIProxy.PlaygroundApp.Tests +namespace AzureOpenAIProxy.PlaygroundApp.Tests.UI { // Playwright 테스트 [TestFixture] @@ -38,7 +38,7 @@ public async Task fieldSetup() [SetUp] public async Task NavigateToTargetPage() { - await _page.GotoAsync("http://localhost:5000/tests"); + await _page.GotoAsync("http://localhost:5001/tests"); await _page.WaitForLoadStateAsync(LoadState.NetworkIdle); // 페이지 초기화 및 fluentSelect 설정 From 6f30180ecffc746e0454cc6866afcc6c68dd8144 Mon Sep 17 00:00:00 2001 From: yj_chun Date: Fri, 23 Aug 2024 10:05:04 +0900 Subject: [PATCH 12/22] =?UTF-8?q?Playwright=20=ED=85=8C=EC=8A=A4=ED=8A=B8?= =?UTF-8?q?=20=EC=BD=94=EB=93=9C=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../UI/DeploymentModelListComponentTests.cs | 59 ++++++------------- 1 file changed, 19 insertions(+), 40 deletions(-) diff --git a/test/AzureOpenAIProxy.PlaygroundApp.Tests/UI/DeploymentModelListComponentTests.cs b/test/AzureOpenAIProxy.PlaygroundApp.Tests/UI/DeploymentModelListComponentTests.cs index 509bd477..a27c7f5b 100644 --- a/test/AzureOpenAIProxy.PlaygroundApp.Tests/UI/DeploymentModelListComponentTests.cs +++ b/test/AzureOpenAIProxy.PlaygroundApp.Tests/UI/DeploymentModelListComponentTests.cs @@ -8,42 +8,21 @@ namespace AzureOpenAIProxy.PlaygroundApp.Tests.UI { - // Playwright 테스트 + // 1. Playwright 테스트 + [Parallelizable(ParallelScope.Self)] [TestFixture] public class ComponentIntegrationTests : PageTest { - private IPlaywright _playwright; - private IBrowser _browser; - private IBrowserContext _context; - private IPage _page; - private IElementHandle? _fluentSelect; - public override BrowserNewContextOptions ContextOptions() => new() { IgnoreHTTPSErrors = true, }; - [SetUp] - public async Task fieldSetup() - { - _playwright = await Microsoft.Playwright.Playwright.CreateAsync(); - _browser = await _playwright.Chromium.LaunchAsync(new BrowserTypeLaunchOptions - { - Headless = true // Integration test를 위해 Headless 모드로 설정 - }); - _context = await _browser.NewContextAsync(); - _page = await _context.NewPageAsync(); - } - [SetUp] public async Task NavigateToTargetPage() { - await _page.GotoAsync("http://localhost:5001/tests"); - await _page.WaitForLoadStateAsync(LoadState.NetworkIdle); - - // 페이지 초기화 및 fluentSelect 설정 - _fluentSelect = await _page.QuerySelectorAsync("fluent-select#deployment-model-list"); - Assert.That(_fluentSelect, Is.Not.Null); + await Page.GotoAsync("http://localhost:5000/tests"); + await Page.WaitForLoadStateAsync(LoadState.NetworkIdle); } [Test] @@ -51,12 +30,12 @@ public async Task NavigateToTargetPage() public async Task IsThereAHeading() { // Act - await Expect(_page + await Expect(Page .GetByRole(AriaRole.Heading, new() { Name = "Deployment" })) .ToBeVisibleAsync(); // Assert - Assert.That(await _page.GetByRole(AriaRole.Heading, new() { Name = "Deployment" }).IsVisibleAsync(), Is.True); + Assert.That(await Page.GetByRole(AriaRole.Heading, new() { Name = "Deployment" }).IsVisibleAsync(), Is.True); } [Test] @@ -64,11 +43,12 @@ await Expect(_page public async Task IsThereADropdownComponent() { // fluentSelect 컴포넌트가 페이지에 존재하는지 확인 - Assert.That(_fluentSelect, Is.Not.Null); - await _fluentSelect.ClickAsync(); + var fluentSelect = await Page.QuerySelectorAsync("fluent-select#deployment-model-list"); + Assert.That(fluentSelect, Is.Not.Null); + await fluentSelect.ClickAsync(); // fluentSelect 컴포넌트의 옵션이 페이지에 표시되는지 확인 - var fluentOptions = await _fluentSelect.QuerySelectorAllAsync("fluent-option"); + var fluentOptions = await fluentSelect.QuerySelectorAllAsync("fluent-option"); Assert.That(fluentOptions.Count, Is.GreaterThan(0)); foreach (var option in fluentOptions) { @@ -81,35 +61,34 @@ public async Task IsThereADropdownComponent() public async Task IsDropdownOptionSelectWorking() { // Arrange - Assert.That(_fluentSelect, Is.Not.Null); - await _fluentSelect.ClickAsync(); - var fluentOptions = await _fluentSelect.QuerySelectorAllAsync("fluent-option"); + var fluentSelect = await Page.QuerySelectorAsync("fluent-select#deployment-model-list"); + Assert.That(fluentSelect, Is.Not.Null); + await fluentSelect.ClickAsync(); + var fluentOptions = await fluentSelect.QuerySelectorAllAsync("fluent-option"); Assert.That(fluentOptions.Count, Is.GreaterThan(0)); // Act var userSelectedOption = fluentOptions[0]; // Select the first option await userSelectedOption.ClickAsync(); - await _page.EvaluateAsync(@"() => { + await Page.EvaluateAsync(@"() => { window.selectValue = document.querySelector('fluent-select#deployment-model-list').value; }"); // Define and set 'selectValue'(Component variable) in the page context // Assert - var userSelectedOptionValue = await _fluentSelect.EvaluateAsync("el => el.value"); // Get the selected value - var actualSelectedValue = await _page.EvaluateAsync("() => selectValue"); // Get the selected value from the page context + var userSelectedOptionValue = await fluentSelect.EvaluateAsync("el => el.value"); // Get the selected value + var actualSelectedValue = await Page.EvaluateAsync("() => selectValue"); // Get the selected value from the page context Assert.That(actualSelectedValue, Is.EqualTo(userSelectedOptionValue)); } [TearDown] public async Task Teardown() { - await _page.CloseAsync(); - await _browser.CloseAsync(); - _playwright.Dispose(); + await Page.CloseAsync(); } } - // Bunit 테스트 + // 2. Bunit 테스트 [TestFixture] public class DeploymentModelListComponentTests : Bunit.TestContext { From 86aa7a7c963e1f73dac9644a67d1520fd9a2fd3e Mon Sep 17 00:00:00 2001 From: yj_chun Date: Sat, 24 Aug 2024 09:41:31 +0900 Subject: [PATCH 13/22] =?UTF-8?q?=EC=A4=91=EB=B3=B5=20=EC=BD=94=EB=93=9C?= =?UTF-8?q?=20=EB=B0=8F=20bUnit=20=ED=85=8C=EC=8A=A4=ED=8A=B8=20=EC=82=AD?= =?UTF-8?q?=EC=A0=9C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- Directory.Build.props | 4 -- .../Components/App.razor | 7 +-- src/AzureOpenAIProxy.PlaygroundApp/Program.cs | 4 -- ...zureOpenAIProxy.PlaygroundApp.Tests.csproj | 10 +--- .../UI/DeploymentModelListComponentTests.cs | 60 +------------------ 5 files changed, 6 insertions(+), 79 deletions(-) diff --git a/Directory.Build.props b/Directory.Build.props index ab94f3f0..e3377330 100644 --- a/Directory.Build.props +++ b/Directory.Build.props @@ -25,9 +25,5 @@ 4.* 1.* 2.* - 1.* - 4.* - 4.* - 4.* diff --git a/src/AzureOpenAIProxy.PlaygroundApp/Components/App.razor b/src/AzureOpenAIProxy.PlaygroundApp/Components/App.razor index 883821e7..ce4e222e 100644 --- a/src/AzureOpenAIProxy.PlaygroundApp/Components/App.razor +++ b/src/AzureOpenAIProxy.PlaygroundApp/Components/App.razor @@ -16,10 +16,9 @@ - + - - diff --git a/src/AzureOpenAIProxy.PlaygroundApp/Program.cs b/src/AzureOpenAIProxy.PlaygroundApp/Program.cs index c9dff061..a61639f7 100644 --- a/src/AzureOpenAIProxy.PlaygroundApp/Program.cs +++ b/src/AzureOpenAIProxy.PlaygroundApp/Program.cs @@ -7,10 +7,6 @@ var builder = WebApplication.CreateBuilder(args); builder.AddServiceDefaults(); -builder.Services.AddHttpClient(); - -// Add services to the FluentUI -builder.Services.AddFluentUIComponents(); // Add services to the container. builder.Services.AddRazorComponents() diff --git a/test/AzureOpenAIProxy.PlaygroundApp.Tests/AzureOpenAIProxy.PlaygroundApp.Tests.csproj b/test/AzureOpenAIProxy.PlaygroundApp.Tests/AzureOpenAIProxy.PlaygroundApp.Tests.csproj index 48f323d8..0ed50954 100644 --- a/test/AzureOpenAIProxy.PlaygroundApp.Tests/AzureOpenAIProxy.PlaygroundApp.Tests.csproj +++ b/test/AzureOpenAIProxy.PlaygroundApp.Tests/AzureOpenAIProxy.PlaygroundApp.Tests.csproj @@ -9,17 +9,11 @@ - all runtime; build; native; contentfiles; analyzers; buildtransitive - - runtime; build; native; contentfiles; analyzers; buildtransitive - all - - @@ -29,9 +23,9 @@ - + diff --git a/test/AzureOpenAIProxy.PlaygroundApp.Tests/UI/DeploymentModelListComponentTests.cs b/test/AzureOpenAIProxy.PlaygroundApp.Tests/UI/DeploymentModelListComponentTests.cs index a27c7f5b..6915d9fb 100644 --- a/test/AzureOpenAIProxy.PlaygroundApp.Tests/UI/DeploymentModelListComponentTests.cs +++ b/test/AzureOpenAIProxy.PlaygroundApp.Tests/UI/DeploymentModelListComponentTests.cs @@ -1,14 +1,9 @@ -using Microsoft.FluentUI.AspNetCore.Components; -using Microsoft.Extensions.DependencyInjection; using Microsoft.Playwright.NUnit; using Microsoft.Playwright; using Assert = NUnit.Framework.Assert; -using Bunit; -using AzureOpenAIProxy.PlaygroundApp.Components.UI; namespace AzureOpenAIProxy.PlaygroundApp.Tests.UI { - // 1. Playwright 테스트 [Parallelizable(ParallelScope.Self)] [TestFixture] public class ComponentIntegrationTests : PageTest @@ -19,7 +14,7 @@ public class ComponentIntegrationTests : PageTest }; [SetUp] - public async Task NavigateToTargetPage() + public async Task Init() { await Page.GotoAsync("http://localhost:5000/tests"); await Page.WaitForLoadStateAsync(LoadState.NetworkIdle); @@ -87,57 +82,4 @@ public async Task Teardown() await Page.CloseAsync(); } } - - // 2. Bunit 테스트 - [TestFixture] - public class DeploymentModelListComponentTests : Bunit.TestContext - { - public DeploymentModelListComponentTests() - { - // FluentUI 구성 요소를 위한 LibraryConfiguration 인스턴스 생성 및 등록 - var libraryConfiguration = new LibraryConfiguration(); - Services.AddSingleton(libraryConfiguration); - - // FluentUI 구성 요소 서비스 추가 - Services.AddFluentUIComponents(); - - // JSInterop 설정 - JSInterop.Mode = JSRuntimeMode.Loose; - } - - [Test] - // 드롭다운이 올바르게 렌더링 되고, 옵션이 표시되는지 확인 - public void ShouldRenderCorrectly() - { - // Arrange & Act - var cut = RenderComponent(); - var fluentSelect = cut.Find("fluent-select#deployment-model-list"); - - // Assert - Assert.That(fluentSelect, Is.Not.Null); - - var fluentOptions = cut.FindAll("fluent-option"); - Assert.That(fluentOptions.Count, Is.GreaterThan(0)); - } - - [Test] - // FluentSelect의 옵션이 선택되면 ValueChanged 이벤트가 트리거되고, 선택된 옵션 값으로 업데이트되는지 확인 - public void ShouldTriggerValueChanged() - { - // Arrange - var cut = RenderComponent(); - var fluentSelect = cut.Find("fluent-select#deployment-model-list"); - - // Act - var fluentOptions = fluentSelect.QuerySelectorAll("fluent-option"); - var actualSelectedValue = fluentOptions[0].GetAttribute("value"); - - // Define and set selectValue in the page context - fluentOptions[0].Click(); // 첫 번째 옵션을 선택 - 여기서 value가 update 되어야 함 - var updatedSelectedValue = cut.Instance.selectValue; - - // Assert - Assert.That(actualSelectedValue, Is.EqualTo(updatedSelectedValue)); - } - } } \ No newline at end of file From cd545ac33c3729e83dde5f4626140371a58879cb Mon Sep 17 00:00:00 2001 From: yj_chun Date: Mon, 26 Aug 2024 21:49:58 +0900 Subject: [PATCH 14/22] =?UTF-8?q?DeploymentModelListComponent.razor=20?= =?UTF-8?q?=EC=88=98=EC=A0=95=20-=20=20=EC=BB=B4=ED=8F=AC=EB=84=8C?= =?UTF-8?q?=ED=8A=B8=20=EC=9D=B4=EB=B2=A4=ED=8A=B8=20=EC=BD=9C=EB=B0=B1=20?= =?UTF-8?q?=EB=B6=80=EB=B6=84=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Components/Pages/Tests.razor | 12 +- .../UI/DeploymentModelListComponent.razor | 131 +++++++++--------- 2 files changed, 76 insertions(+), 67 deletions(-) diff --git a/src/AzureOpenAIProxy.PlaygroundApp/Components/Pages/Tests.razor b/src/AzureOpenAIProxy.PlaygroundApp/Components/Pages/Tests.razor index bf6b4e7d..f7bd0ea4 100644 --- a/src/AzureOpenAIProxy.PlaygroundApp/Components/Pages/Tests.razor +++ b/src/AzureOpenAIProxy.PlaygroundApp/Components/Pages/Tests.razor @@ -2,4 +2,14 @@ @using AzureOpenAIProxy.PlaygroundApp.Components.UI @rendermode InteractiveServer - \ No newline at end of file + + +

Selected Value: @value

+ +@code { + private string? value; + private void HandleSelectedValue(string val) + { + value = val; + } +} \ No newline at end of file diff --git a/src/AzureOpenAIProxy.PlaygroundApp/Components/UI/DeploymentModelListComponent.razor b/src/AzureOpenAIProxy.PlaygroundApp/Components/UI/DeploymentModelListComponent.razor index 640d117b..779cf6cd 100644 --- a/src/AzureOpenAIProxy.PlaygroundApp/Components/UI/DeploymentModelListComponent.razor +++ b/src/AzureOpenAIProxy.PlaygroundApp/Components/UI/DeploymentModelListComponent.razor @@ -2,80 +2,79 @@ @using Microsoft.FluentUI.AspNetCore.Components - +
+ + * +
- - Alabama - Alaska - Arizona - Arkansas - California - Colorado - Connecticut - Delaware - Florida - Georgia - Hawaii - Idaho - Illinois - Indiana - Iowa - Kansas - Kentucky - Louisiana - Maine - Maryland - Massachussets - Michigain - Minnesota - Mississippi - Missouri - Montana - Nebraska - Nevada - New Hampshire - New Jersey - New Mexico - New York - North Carolina - North Dakota - Ohio - Oklahoma - Oregon - Pennsylvania + -

- @if (!string.IsNullOrEmpty(selectValue)) - { -

Selected Value: @selectValue

- } - else - { -

none

- } -

- @code { [Parameter] - public string? selectValue { get; set; } - protected void ValueChanged(string value) + public string? selectedValue { get; set; } + public Option? selectedOption { get; set; } + + [Parameter] + public EventCallback OptionSelected { get; set; } + + private async Task OnValueChanged() { - selectValue = value; - if (!string.IsNullOrEmpty(selectValue)) - { - Console.WriteLine($"Selected Value: {selectValue}"); - } - else + if (selectedOption != null && selectedOption.Value != null) { - Console.WriteLine("none"); + selectedValue = selectedOption.Value?.ToString(); + await OptionSelected.InvokeAsync(selectedValue); } } + + static List> deploymentModelOptions = new() + { + new Option { Value = "AL", Text = "Alabama", Selected = true }, + new Option { Value = "AK", Text = "Alaska" }, + new Option { Value = "AZ", Text = "Arizona" }, + new Option { Value = "AR", Text = "Arkansas" }, + new Option { Value = "CA", Text = "California" }, + new Option { Value = "CO", Text = "Colorado" }, + new Option { Value = "CT", Text = "Connecticut" }, + new Option { Value = "DE", Text = "Delaware" }, + new Option { Value = "FL", Text = "Florida" }, + new Option { Value = "GA", Text = "Georgia" }, + new Option { Value = "HI", Text = "Hawaii" }, + new Option { Value = "ID", Text = "Idaho" }, + new Option { Value = "IL", Text = "Illinois" }, + new Option { Value = "IN", Text = "Indiana" }, + new Option { Value = "IA", Text = "Iowa" }, + new Option { Value = "KS", Text = "Kansas" }, + new Option { Value = "KY", Text = "Kentucky" }, + new Option { Value = "LA", Text = "Louisiana" }, + new Option { Value = "ME", Text = "Maine" }, + new Option { Value = "MD", Text = "Maryland" }, + new Option { Value = "MA", Text = "Massachussets" }, + new Option { Value = "MI", Text = "Michigain" }, + new Option { Value = "MN", Text = "Minnesota" }, + new Option { Value = "MS", Text = "Mississippi" }, + new Option { Value = "MO", Text = "Missouri" }, + new Option { Value = "MT", Text = "Montana" }, + new Option { Value = "NE", Text = "Nebraska" }, + new Option { Value = "NV", Text = "Nevada" }, + new Option { Value = "NH", Text = "New Hampshire" }, + new Option { Value = "NJ", Text = "New Jersey" }, + new Option { Value = "NM", Text = "New Mexico" }, + new Option { Value = "NY", Text = "New York" }, + new Option { Value = "NC", Text = "North Carolina" }, + new Option { Value = "ND", Text = "North Dakota" }, + new Option { Value = "OH", Text = "Ohio" }, + new Option { Value = "OK", Text = "Oklahoma" }, + new Option { Value = "OR", Text = "Oregon" }, + new Option { Value = "PA", Text = "Pennsylvania" } + }; } \ No newline at end of file From b820b0791f53240258c98aed9803a9291fe78f9d Mon Sep 17 00:00:00 2001 From: yj_chun Date: Mon, 26 Aug 2024 22:00:40 +0900 Subject: [PATCH 15/22] =?UTF-8?q?Playwright=20=ED=85=8C=EC=8A=A4=ED=8A=B8?= =?UTF-8?q?=20=EC=BD=94=EB=93=9C=20=EC=88=98=EC=A0=95(=ED=98=84=EC=9E=AC?= =?UTF-8?q?=20=EB=A1=9C=EC=BB=AC=EC=97=90=EC=84=9C=20=ED=85=8C=EC=8A=A4?= =?UTF-8?q?=ED=8A=B8=20=EC=8B=9C=20=EB=AA=A8=EB=91=90=20fail=20-=20?= =?UTF-8?q?=EC=88=98=EC=A0=95=20=EB=8D=94=20=ED=95=84=EC=9A=94=ED=95=A8)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../UI/DeploymentModelListComponentTests.cs | 89 +++++++++++-------- 1 file changed, 51 insertions(+), 38 deletions(-) diff --git a/test/AzureOpenAIProxy.PlaygroundApp.Tests/UI/DeploymentModelListComponentTests.cs b/test/AzureOpenAIProxy.PlaygroundApp.Tests/UI/DeploymentModelListComponentTests.cs index 6915d9fb..7ab03022 100644 --- a/test/AzureOpenAIProxy.PlaygroundApp.Tests/UI/DeploymentModelListComponentTests.cs +++ b/test/AzureOpenAIProxy.PlaygroundApp.Tests/UI/DeploymentModelListComponentTests.cs @@ -6,7 +6,8 @@ namespace AzureOpenAIProxy.PlaygroundApp.Tests.UI { [Parallelizable(ParallelScope.Self)] [TestFixture] - public class ComponentIntegrationTests : PageTest + [Property("Category", "Integration")] + public class ModelDropdownListComponentTests : PageTest { public override BrowserNewContextOptions ContextOptions() => new() { @@ -21,59 +22,71 @@ public async Task Init() } [Test] - // 페이지에서 컴포넌트의 헤딩이 올바르게 표시되는지 확인 - public async Task IsThereAHeading() + // 페이지에서 컴포넌트 레이블이 올바르게 표시되는지 확인 + public async Task Given_ComponentLabel_When_Waiting_Then_ShouldBeVisible() { - // Act - await Expect(Page - .GetByRole(AriaRole.Heading, new() { Name = "Deployment" })) - .ToBeVisibleAsync(); + // given + var componentLabel = Page.GetByText("Deployment"); + await Expect(componentLabel).ToBeVisibleAsync(); + + // when + var expected = await Page.GetByText("Deployment").IsVisibleAsync(); - // Assert - Assert.That(await Page.GetByRole(AriaRole.Heading, new() { Name = "Deployment" }).IsVisibleAsync(), Is.True); + // then + Assert.That(expected, Is.True); } [Test] // 페이지에서 드롭다운 컴포넌트가 올바르게 표시되는지 확인 - public async Task IsThereADropdownComponent() + public async Task Given_Dropdown_When_Waiting_Then_ShouldBeVisible() { - // fluentSelect 컴포넌트가 페이지에 존재하는지 확인 - var fluentSelect = await Page.QuerySelectorAsync("fluent-select#deployment-model-list"); - Assert.That(fluentSelect, Is.Not.Null); - await fluentSelect.ClickAsync(); + // given + // var fluentSelect = Page.GetByRole(AriaRole.Combobox, new() { Name = "Deployment" }); + var fluentSelect = Page.Locator("fluent-select#deployment-model-list"); + await Expect(fluentSelect).ToBeVisibleAsync(); - // fluentSelect 컴포넌트의 옵션이 페이지에 표시되는지 확인 - var fluentOptions = await fluentSelect.QuerySelectorAllAsync("fluent-option"); - Assert.That(fluentOptions.Count, Is.GreaterThan(0)); - foreach (var option in fluentOptions) - { - Assert.That(await option.IsVisibleAsync(), Is.True); - } + // when + var expected = await fluentSelect.IsVisibleAsync(); + + // then + Assert.That(expected, Is.True); } [Test] - // 드롭다운의 옵션 값을 선택하고, 선택된 값이 컴포넌트에 올바르게 업데이트 되는지 확인 - public async Task IsDropdownOptionSelectWorking() + // 드롭다운의 옵션 값이 존재하는지 확인 + public async Task Given_Dropdown_When_CountingOption_Then_ShouldOptionExist() { - // Arrange - var fluentSelect = await Page.QuerySelectorAsync("fluent-select#deployment-model-list"); - Assert.That(fluentSelect, Is.Not.Null); + // given + var fluentSelect = Page.Locator("fluent-select#deployment-model-list"); + await Expect(fluentSelect).ToBeVisibleAsync(); await fluentSelect.ClickAsync(); - var fluentOptions = await fluentSelect.QuerySelectorAllAsync("fluent-option"); - Assert.That(fluentOptions.Count, Is.GreaterThan(0)); - // Act - var userSelectedOption = fluentOptions[0]; // Select the first option - await userSelectedOption.ClickAsync(); + // when + int count = await fluentSelect.Locator("fluent-option").CountAsync(); + //int count = await Page.QuerySelectorAllAsync("fluent-option").Count(); + + // then + Assert.That(count, Is.GreaterThan(0)); + } + + [Test] + // 드롭다운의 옵션 값을 선택하면 부모 컴포넌트(페이지 컴포넌트)에 올바르게 업데이트 되는지 확인 + public async Task Given_Dropdown_When_OptionSelected_Then_ShouldUpdateComponentValue() + { + // given + var fluentSelect = Page.Locator("fluent-select#deployment-model-list"); + await Expect(fluentSelect).ToBeVisibleAsync(); + var expectedValue = "AZ"; // 컴포넌트 3번째 옵션 값 + //var fluentOptions = fluentSelect.Locator("fluent-option"); + await fluentSelect.ClickAsync(); // 드롭다운 클릭 + await fluentSelect.Locator("fluent-option").Nth(2).ScrollIntoViewIfNeededAsync(); // 3번째 옵션 보이도록 스크롤 + await fluentSelect.Locator("fluent-option").Nth(2).ClickAsync(); // 옵션 클릭 - await Page.EvaluateAsync(@"() => { - window.selectValue = document.querySelector('fluent-select#deployment-model-list').value; - }"); // Define and set 'selectValue'(Component variable) in the page context + // when + var actualValue = await Page.EvaluateAsync("() => document.querySelector('fluent-select#deployment-model-list').value"); // 페이지 내 컴포넌트 값 가져오기 - // Assert - var userSelectedOptionValue = await fluentSelect.EvaluateAsync("el => el.value"); // Get the selected value - var actualSelectedValue = await Page.EvaluateAsync("() => selectValue"); // Get the selected value from the page context - Assert.That(actualSelectedValue, Is.EqualTo(userSelectedOptionValue)); + // then + Assert.That(expectedValue, Is.EqualTo(actualValue)); } [TearDown] From 4a67022ef86137fbd91d7bb3f7c87d2245573060 Mon Sep 17 00:00:00 2001 From: yj_chun Date: Tue, 27 Aug 2024 15:00:33 +0900 Subject: [PATCH 16/22] =?UTF-8?q?DeploymentModelList=20=EC=BB=B4=ED=8F=AC?= =?UTF-8?q?=EB=84=8C=ED=8A=B8=20=ED=8C=8C=EC=9D=BC=EC=97=90=20OnInitialize?= =?UTF-8?q?dAsync(),=20Tests.razor=EC=97=90=20OnAfterRenderAsync()=20?= =?UTF-8?q?=EC=B6=94=EA=B0=80=20=EB=B0=8F=20=EC=88=98=EC=A0=95=20&=20?= =?UTF-8?q?=ED=85=8C=EC=8A=A4=ED=8A=B8=20=EC=BD=94=EB=93=9C=20=EC=88=98?= =?UTF-8?q?=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Components/App.razor | 4 +- .../Components/Pages/Tests.razor | 18 ++++++-- .../UI/DeploymentModelListComponent.razor | 19 +++++---- .../UI/DeploymentModelListComponentTests.cs | 41 ++++++++----------- 4 files changed, 41 insertions(+), 41 deletions(-) diff --git a/src/AzureOpenAIProxy.PlaygroundApp/Components/App.razor b/src/AzureOpenAIProxy.PlaygroundApp/Components/App.razor index ce4e222e..6b73ab6b 100644 --- a/src/AzureOpenAIProxy.PlaygroundApp/Components/App.razor +++ b/src/AzureOpenAIProxy.PlaygroundApp/Components/App.razor @@ -16,9 +16,7 @@ - + diff --git a/src/AzureOpenAIProxy.PlaygroundApp/Components/Pages/Tests.razor b/src/AzureOpenAIProxy.PlaygroundApp/Components/Pages/Tests.razor index f7bd0ea4..ed40919e 100644 --- a/src/AzureOpenAIProxy.PlaygroundApp/Components/Pages/Tests.razor +++ b/src/AzureOpenAIProxy.PlaygroundApp/Components/Pages/Tests.razor @@ -2,14 +2,24 @@ @using AzureOpenAIProxy.PlaygroundApp.Components.UI @rendermode InteractiveServer - + -

Selected Value: @value

+

Selected Value: @selectedModelValue

@code { - private string? value; + private string? selectedModelValue; + + protected override async Task OnAfterRenderAsync(bool firstRender) + { + if (firstRender) + { + selectedModelValue = "Initial Value"; + await Task.CompletedTask; + } + } + private void HandleSelectedValue(string val) { - value = val; + selectedModelValue = val; } } \ No newline at end of file diff --git a/src/AzureOpenAIProxy.PlaygroundApp/Components/UI/DeploymentModelListComponent.razor b/src/AzureOpenAIProxy.PlaygroundApp/Components/UI/DeploymentModelListComponent.razor index 779cf6cd..d3cd4146 100644 --- a/src/AzureOpenAIProxy.PlaygroundApp/Components/UI/DeploymentModelListComponent.razor +++ b/src/AzureOpenAIProxy.PlaygroundApp/Components/UI/DeploymentModelListComponent.razor @@ -12,7 +12,6 @@ OptionText="@(e => e.Text?.ToString())" OptionValue="@(e => e.Value?.ToString())" OptionSelected="@(e => e.Selected)" - @bind-Value="@selectedValue" @bind-SelectedOption="@selectedOption" @onclick="OnValueChanged" aria-labelledby="deployment-model-label"> @@ -21,24 +20,26 @@ @code { [Parameter] - public string? selectedValue { get; set; } public Option? selectedOption { get; set; } [Parameter] - public EventCallback OptionSelected { get; set; } + public EventCallback UserSelectedOption { get; set; } + protected override async Task OnInitializedAsync() + { + selectedOption = new Option(); + await Task.CompletedTask; + } + private async Task OnValueChanged() { - if (selectedOption != null && selectedOption.Value != null) - { - selectedValue = selectedOption.Value?.ToString(); - await OptionSelected.InvokeAsync(selectedValue); - } + string? selectedValue = selectedOption?.Value?.ToString(); + await UserSelectedOption.InvokeAsync(selectedValue); } static List> deploymentModelOptions = new() { - new Option { Value = "AL", Text = "Alabama", Selected = true }, + new Option { Value = "AL", Text = "Alabama" }, new Option { Value = "AK", Text = "Alaska" }, new Option { Value = "AZ", Text = "Arizona" }, new Option { Value = "AR", Text = "Arkansas" }, diff --git a/test/AzureOpenAIProxy.PlaygroundApp.Tests/UI/DeploymentModelListComponentTests.cs b/test/AzureOpenAIProxy.PlaygroundApp.Tests/UI/DeploymentModelListComponentTests.cs index 7ab03022..bf7c1c98 100644 --- a/test/AzureOpenAIProxy.PlaygroundApp.Tests/UI/DeploymentModelListComponentTests.cs +++ b/test/AzureOpenAIProxy.PlaygroundApp.Tests/UI/DeploymentModelListComponentTests.cs @@ -27,13 +27,9 @@ public async Task Given_ComponentLabel_When_Waiting_Then_ShouldBeVisible() { // given var componentLabel = Page.GetByText("Deployment"); - await Expect(componentLabel).ToBeVisibleAsync(); - // when - var expected = await Page.GetByText("Deployment").IsVisibleAsync(); - - // then - Assert.That(expected, Is.True); + // when & then + await Expect(componentLabel).ToBeVisibleAsync(); } [Test] @@ -41,48 +37,43 @@ public async Task Given_ComponentLabel_When_Waiting_Then_ShouldBeVisible() public async Task Given_Dropdown_When_Waiting_Then_ShouldBeVisible() { // given - // var fluentSelect = Page.GetByRole(AriaRole.Combobox, new() { Name = "Deployment" }); var fluentSelect = Page.Locator("fluent-select#deployment-model-list"); - await Expect(fluentSelect).ToBeVisibleAsync(); - // when - var expected = await fluentSelect.IsVisibleAsync(); - - // then - Assert.That(expected, Is.True); + // when & then + await Expect(fluentSelect).ToBeVisibleAsync(); } [Test] // 드롭다운의 옵션 값이 존재하는지 확인 - public async Task Given_Dropdown_When_CountingOption_Then_ShouldOptionExist() + public async Task Given_Dropdown_When_ClickToShowOption_Then_ShouldOptionExist() { // given var fluentSelect = Page.Locator("fluent-select#deployment-model-list"); - await Expect(fluentSelect).ToBeVisibleAsync(); - await fluentSelect.ClickAsync(); // when - int count = await fluentSelect.Locator("fluent-option").CountAsync(); - //int count = await Page.QuerySelectorAllAsync("fluent-option").Count(); + await fluentSelect.ClickAsync(); + var fluentOptions = fluentSelect.Locator("fluent-option"); // then - Assert.That(count, Is.GreaterThan(0)); + for (int i = 0; i < await fluentOptions.CountAsync(); i++) + { + await Expect(fluentOptions.Nth(i)).ToBeVisibleAsync(); + } } [Test] // 드롭다운의 옵션 값을 선택하면 부모 컴포넌트(페이지 컴포넌트)에 올바르게 업데이트 되는지 확인 - public async Task Given_Dropdown_When_OptionSelected_Then_ShouldUpdateComponentValue() + public async Task Given_DropdownOption_When_OptionSelected_Then_ShouldUpdateComponentValue() { // given var fluentSelect = Page.Locator("fluent-select#deployment-model-list"); - await Expect(fluentSelect).ToBeVisibleAsync(); var expectedValue = "AZ"; // 컴포넌트 3번째 옵션 값 - //var fluentOptions = fluentSelect.Locator("fluent-option"); - await fluentSelect.ClickAsync(); // 드롭다운 클릭 - await fluentSelect.Locator("fluent-option").Nth(2).ScrollIntoViewIfNeededAsync(); // 3번째 옵션 보이도록 스크롤 - await fluentSelect.Locator("fluent-option").Nth(2).ClickAsync(); // 옵션 클릭 + await fluentSelect.ClickAsync(); + var fluentOptions = fluentSelect.Locator("fluent-option"); // when + await fluentOptions.Nth(2).ScrollIntoViewIfNeededAsync(); // 3번째 옵션 보이도록 스크롤 + await fluentOptions.Nth(2).ClickAsync(); // 옵션 클릭 var actualValue = await Page.EvaluateAsync("() => document.querySelector('fluent-select#deployment-model-list').value"); // 페이지 내 컴포넌트 값 가져오기 // then From 3b8b85f19e6a4ef4a218abc4c2c6e3719a787f13 Mon Sep 17 00:00:00 2001 From: yj_chun Date: Wed, 28 Aug 2024 15:45:52 +0900 Subject: [PATCH 17/22] =?UTF-8?q?DeploymentModelList=20=EC=BB=B4=ED=8F=AC?= =?UTF-8?q?=EB=84=8C=ED=8A=B8=20=ED=8C=8C=EC=9D=BC=20=EC=9D=B4=EB=B2=A4?= =?UTF-8?q?=ED=8A=B8=20=EC=BD=9C=EB=B0=B1=20=EB=A9=94=EC=86=8C=EB=93=9C=20?= =?UTF-8?q?&=20=ED=85=8C=EC=8A=A4=ED=8A=B8=20=EC=BD=94=EB=93=9C=20?= =?UTF-8?q?=ED=8C=8C=EC=9D=BC=20=EB=A9=94=EC=86=8C=EB=93=9C=20=EC=9D=B4?= =?UTF-8?q?=EB=A6=84=20=EC=88=98=EC=A0=95,=20Tests.razor=20OnAfterRenderAs?= =?UTF-8?q?ync=20->=20OnInitialized=EB=A1=9C=20=EB=8C=80=EC=B2=B4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Components/Pages/Tests.razor | 12 ++++------- .../UI/DeploymentModelListComponent.razor | 13 +++--------- .../UI/DeploymentModelListComponentTests.cs | 20 +++++++++---------- 3 files changed, 17 insertions(+), 28 deletions(-) diff --git a/src/AzureOpenAIProxy.PlaygroundApp/Components/Pages/Tests.razor b/src/AzureOpenAIProxy.PlaygroundApp/Components/Pages/Tests.razor index ed40919e..1c1ba493 100644 --- a/src/AzureOpenAIProxy.PlaygroundApp/Components/Pages/Tests.razor +++ b/src/AzureOpenAIProxy.PlaygroundApp/Components/Pages/Tests.razor @@ -2,20 +2,16 @@ @using AzureOpenAIProxy.PlaygroundApp.Components.UI @rendermode InteractiveServer - +

Selected Value: @selectedModelValue

@code { private string? selectedModelValue; - - protected override async Task OnAfterRenderAsync(bool firstRender) + + protected override void OnInitialized() { - if (firstRender) - { - selectedModelValue = "Initial Value"; - await Task.CompletedTask; - } + ; } private void HandleSelectedValue(string val) diff --git a/src/AzureOpenAIProxy.PlaygroundApp/Components/UI/DeploymentModelListComponent.razor b/src/AzureOpenAIProxy.PlaygroundApp/Components/UI/DeploymentModelListComponent.razor index d3cd4146..b11d82bd 100644 --- a/src/AzureOpenAIProxy.PlaygroundApp/Components/UI/DeploymentModelListComponent.razor +++ b/src/AzureOpenAIProxy.PlaygroundApp/Components/UI/DeploymentModelListComponent.razor @@ -19,22 +19,15 @@ @code { - [Parameter] - public Option? selectedOption { get; set; } + public Option? selectedOption { get; set; } = new(); [Parameter] - public EventCallback UserSelectedOption { get; set; } - - protected override async Task OnInitializedAsync() - { - selectedOption = new Option(); - await Task.CompletedTask; - } + public EventCallback OnUserOptionSelected { get; set; } private async Task OnValueChanged() { string? selectedValue = selectedOption?.Value?.ToString(); - await UserSelectedOption.InvokeAsync(selectedValue); + await OnUserOptionSelected.InvokeAsync(selectedValue); } static List> deploymentModelOptions = new() diff --git a/test/AzureOpenAIProxy.PlaygroundApp.Tests/UI/DeploymentModelListComponentTests.cs b/test/AzureOpenAIProxy.PlaygroundApp.Tests/UI/DeploymentModelListComponentTests.cs index bf7c1c98..1e5fa3f2 100644 --- a/test/AzureOpenAIProxy.PlaygroundApp.Tests/UI/DeploymentModelListComponentTests.cs +++ b/test/AzureOpenAIProxy.PlaygroundApp.Tests/UI/DeploymentModelListComponentTests.cs @@ -23,18 +23,18 @@ public async Task Init() [Test] // 페이지에서 컴포넌트 레이블이 올바르게 표시되는지 확인 - public async Task Given_ComponentLabel_When_Waiting_Then_ShouldBeVisible() + public async Task Given_Label_When_Page_Loaded_Then_Label_Should_Be_Visible() { // given - var componentLabel = Page.GetByText("Deployment"); + var label = Page.GetByText("Deployment"); // when & then - await Expect(componentLabel).ToBeVisibleAsync(); + await Expect(label).ToBeVisibleAsync(); } [Test] // 페이지에서 드롭다운 컴포넌트가 올바르게 표시되는지 확인 - public async Task Given_Dropdown_When_Waiting_Then_ShouldBeVisible() + public async Task Given_Dropdown_When_Page_Loaded_Then_Dropdown_Should_Be_Visible() { // given var fluentSelect = Page.Locator("fluent-select#deployment-model-list"); @@ -45,7 +45,7 @@ public async Task Given_Dropdown_When_Waiting_Then_ShouldBeVisible() [Test] // 드롭다운의 옵션 값이 존재하는지 확인 - public async Task Given_Dropdown_When_ClickToShowOption_Then_ShouldOptionExist() + public async Task Given_Dropdown_When_Dropdown_Clicked_And_DropdownOptions_Appeared_Then_All_DropdownOptions_Should_Be_Visible() { // given var fluentSelect = Page.Locator("fluent-select#deployment-model-list"); @@ -63,25 +63,25 @@ public async Task Given_Dropdown_When_ClickToShowOption_Then_ShouldOptionExist() [Test] // 드롭다운의 옵션 값을 선택하면 부모 컴포넌트(페이지 컴포넌트)에 올바르게 업데이트 되는지 확인 - public async Task Given_DropdownOption_When_OptionSelected_Then_ShouldUpdateComponentValue() + public async Task Given_DropdownOptions_And_ExpectedValue_When_Third_DropdownOption_Selected_And_DropdownValue_Updated_Then_DropdownValue_Should_Match_ExpectedValue() { // given var fluentSelect = Page.Locator("fluent-select#deployment-model-list"); - var expectedValue = "AZ"; // 컴포넌트 3번째 옵션 값 await fluentSelect.ClickAsync(); var fluentOptions = fluentSelect.Locator("fluent-option"); + var expectedValue = "AZ"; // 실제 컴포넌트 3번째 옵션 값 // when - await fluentOptions.Nth(2).ScrollIntoViewIfNeededAsync(); // 3번째 옵션 보이도록 스크롤 + await fluentOptions.Nth(2).ScrollIntoViewIfNeededAsync(); // 컴포넌트 3번째 옵션 보이도록 스크롤 await fluentOptions.Nth(2).ClickAsync(); // 옵션 클릭 var actualValue = await Page.EvaluateAsync("() => document.querySelector('fluent-select#deployment-model-list').value"); // 페이지 내 컴포넌트 값 가져오기 // then - Assert.That(expectedValue, Is.EqualTo(actualValue)); + Assert.That(actualValue, Is.EqualTo(expectedValue)); } [TearDown] - public async Task Teardown() + public async Task CleanUp() { await Page.CloseAsync(); } From 101c17e7d7dab93f1a2ce84eb5e7b8d2e2239d24 Mon Sep 17 00:00:00 2001 From: yj_chun Date: Wed, 28 Aug 2024 20:14:41 +0900 Subject: [PATCH 18/22] =?UTF-8?q?Tests.razor=20OnInitialized=20->=20OnInit?= =?UTF-8?q?ializedAsync=EB=A1=9C=20=EB=B3=80=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Components/Pages/Tests.razor | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/AzureOpenAIProxy.PlaygroundApp/Components/Pages/Tests.razor b/src/AzureOpenAIProxy.PlaygroundApp/Components/Pages/Tests.razor index 1c1ba493..daa25fdb 100644 --- a/src/AzureOpenAIProxy.PlaygroundApp/Components/Pages/Tests.razor +++ b/src/AzureOpenAIProxy.PlaygroundApp/Components/Pages/Tests.razor @@ -7,11 +7,11 @@

Selected Value: @selectedModelValue

@code { - private string? selectedModelValue; + private string? selectedModelValue = ""; - protected override void OnInitialized() + protected override async Task OnInitializedAsync() { - ; + await base.OnInitializedAsync(); } private void HandleSelectedValue(string val) From 07a052cbeedb02d85fe26d421b7153e4c207db00 Mon Sep 17 00:00:00 2001 From: yj_chun Date: Sat, 31 Aug 2024 14:48:56 +0900 Subject: [PATCH 19/22] =?UTF-8?q?Test=20=EC=BD=94=EB=93=9C=20-=20Arrange,?= =?UTF-8?q?=20Act,=20Assert=20=EB=AA=85=EC=8B=9C=20=EB=B0=8F=20=ED=8C=8C?= =?UTF-8?q?=EB=9D=BC=EB=AF=B8=ED=84=B0=EB=9D=BC=EC=9D=B4=EC=A7=95=20?= =?UTF-8?q?=EB=93=B1=20=EC=88=98=EC=A0=95,=20=EB=93=9C=EB=A1=AD=EB=8B=A4?= =?UTF-8?q?=EC=9A=B4=20=EC=BB=B4=ED=8F=AC=EB=84=8C=ED=8A=B8=20=EC=BD=94?= =?UTF-8?q?=EB=93=9C=20-=20=ED=95=84=EB=93=9C=20scope=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../UI/DeploymentModelListComponent.razor | 2 +- .../UI/DeploymentModelListComponentTests.cs | 36 ++++++++++--------- 2 files changed, 21 insertions(+), 17 deletions(-) diff --git a/src/AzureOpenAIProxy.PlaygroundApp/Components/UI/DeploymentModelListComponent.razor b/src/AzureOpenAIProxy.PlaygroundApp/Components/UI/DeploymentModelListComponent.razor index b11d82bd..4488c4ad 100644 --- a/src/AzureOpenAIProxy.PlaygroundApp/Components/UI/DeploymentModelListComponent.razor +++ b/src/AzureOpenAIProxy.PlaygroundApp/Components/UI/DeploymentModelListComponent.razor @@ -19,7 +19,7 @@ @code { - public Option? selectedOption { get; set; } = new(); + private Option? selectedOption { get; set; } = new(); [Parameter] public EventCallback OnUserOptionSelected { get; set; } diff --git a/test/AzureOpenAIProxy.PlaygroundApp.Tests/UI/DeploymentModelListComponentTests.cs b/test/AzureOpenAIProxy.PlaygroundApp.Tests/UI/DeploymentModelListComponentTests.cs index 1e5fa3f2..c9a6aff2 100644 --- a/test/AzureOpenAIProxy.PlaygroundApp.Tests/UI/DeploymentModelListComponentTests.cs +++ b/test/AzureOpenAIProxy.PlaygroundApp.Tests/UI/DeploymentModelListComponentTests.cs @@ -1,6 +1,6 @@ using Microsoft.Playwright.NUnit; using Microsoft.Playwright; -using Assert = NUnit.Framework.Assert; +using FluentAssertions; namespace AzureOpenAIProxy.PlaygroundApp.Tests.UI { @@ -25,10 +25,10 @@ public async Task Init() // 페이지에서 컴포넌트 레이블이 올바르게 표시되는지 확인 public async Task Given_Label_When_Page_Loaded_Then_Label_Should_Be_Visible() { - // given + // Act var label = Page.GetByText("Deployment"); - // when & then + // Assert await Expect(label).ToBeVisibleAsync(); } @@ -36,10 +36,10 @@ public async Task Given_Label_When_Page_Loaded_Then_Label_Should_Be_Visible() // 페이지에서 드롭다운 컴포넌트가 올바르게 표시되는지 확인 public async Task Given_Dropdown_When_Page_Loaded_Then_Dropdown_Should_Be_Visible() { - // given + // Act var fluentSelect = Page.Locator("fluent-select#deployment-model-list"); - // when & then + // Assert await Expect(fluentSelect).ToBeVisibleAsync(); } @@ -47,37 +47,41 @@ public async Task Given_Dropdown_When_Page_Loaded_Then_Dropdown_Should_Be_Visibl // 드롭다운의 옵션 값이 존재하는지 확인 public async Task Given_Dropdown_When_Dropdown_Clicked_And_DropdownOptions_Appeared_Then_All_DropdownOptions_Should_Be_Visible() { - // given + // Arrange var fluentSelect = Page.Locator("fluent-select#deployment-model-list"); - // when + // Act await fluentSelect.ClickAsync(); var fluentOptions = fluentSelect.Locator("fluent-option"); - // then + // Assert for (int i = 0; i < await fluentOptions.CountAsync(); i++) { await Expect(fluentOptions.Nth(i)).ToBeVisibleAsync(); } } + [TestCase("AZ", 2)] + [TestCase("CA", 4)] + [TestCase("CT", 6)] + [TestCase("FL", 8)] [Test] // 드롭다운의 옵션 값을 선택하면 부모 컴포넌트(페이지 컴포넌트)에 올바르게 업데이트 되는지 확인 - public async Task Given_DropdownOptions_And_ExpectedValue_When_Third_DropdownOption_Selected_And_DropdownValue_Updated_Then_DropdownValue_Should_Match_ExpectedValue() + public async Task Given_DropdownOptions_And_ExpectedValue_When_Third_DropdownOption_Selected_And_DropdownValue_Updated_Then_DropdownValue_Should_Match_ExpectedValue(string exp, int n) { - // given + // Arrange var fluentSelect = Page.Locator("fluent-select#deployment-model-list"); await fluentSelect.ClickAsync(); var fluentOptions = fluentSelect.Locator("fluent-option"); - var expectedValue = "AZ"; // 실제 컴포넌트 3번째 옵션 값 + var expectedValue = exp; // 실제 컴포넌트 옵션 값 - // when - await fluentOptions.Nth(2).ScrollIntoViewIfNeededAsync(); // 컴포넌트 3번째 옵션 보이도록 스크롤 - await fluentOptions.Nth(2).ClickAsync(); // 옵션 클릭 + // Act + await fluentOptions.Nth(n).ScrollIntoViewIfNeededAsync(); // 선택할 컴포넌트 옵션 보이도록 스크롤 + await fluentOptions.Nth(n).ClickAsync(); // 옵션 클릭 var actualValue = await Page.EvaluateAsync("() => document.querySelector('fluent-select#deployment-model-list').value"); // 페이지 내 컴포넌트 값 가져오기 - // then - Assert.That(actualValue, Is.EqualTo(expectedValue)); + // Assert + actualValue.Should().Be(expectedValue); } [TearDown] From 8e20784e61948f58aece0e51d29b13cff777c76f Mon Sep 17 00:00:00 2001 From: yj_chun Date: Sat, 31 Aug 2024 23:07:37 +0900 Subject: [PATCH 20/22] =?UTF-8?q?=EB=93=9C=EB=A1=AD=EB=8B=A4=EC=9A=B4=20?= =?UTF-8?q?=EC=BB=B4=ED=8F=AC=EB=84=8C=ED=8A=B8=20=ED=8C=8C=EC=9D=BC=20-?= =?UTF-8?q?=20=EB=B6=88=ED=95=84=EC=9A=94=ED=95=9C=20using=20=EC=82=AD?= =?UTF-8?q?=EC=A0=9C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Components/UI/DeploymentModelListComponent.razor | 1 - 1 file changed, 1 deletion(-) diff --git a/src/AzureOpenAIProxy.PlaygroundApp/Components/UI/DeploymentModelListComponent.razor b/src/AzureOpenAIProxy.PlaygroundApp/Components/UI/DeploymentModelListComponent.razor index 4488c4ad..f0923b3f 100644 --- a/src/AzureOpenAIProxy.PlaygroundApp/Components/UI/DeploymentModelListComponent.razor +++ b/src/AzureOpenAIProxy.PlaygroundApp/Components/UI/DeploymentModelListComponent.razor @@ -1,5 +1,4 @@ @using AzureOpenAIProxy.PlaygroundApp.Clients -@using Microsoft.FluentUI.AspNetCore.Components
From 48f9ea78198d74f237762d0ade77a0d3650398c3 Mon Sep 17 00:00:00 2001 From: yj_chun Date: Sun, 1 Sep 2024 12:50:07 +0900 Subject: [PATCH 21/22] =?UTF-8?q?Tests.razor=20=EB=A9=94=EC=86=8C=EB=93=9C?= =?UTF-8?q?=20async=20=EC=88=98=EC=A0=95=20=EB=B0=8F=20=EB=93=9C=EB=A1=AD?= =?UTF-8?q?=EB=8B=A4=EC=9A=B4=20=EC=BB=B4=ED=8F=AC=EB=84=8C=ED=8A=B8=20?= =?UTF-8?q?=EA=B0=92=20=ED=99=95=EC=9D=B8=20DebugButtonComponent=EB=A1=9C?= =?UTF-8?q?=20=EA=B0=80=EB=8A=A5=ED=95=98=EA=B2=8C=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Components/Pages/Tests.razor | 12 +++++++----- .../Components/UI/DeploymentModelListComponent.razor | 2 -- 2 files changed, 7 insertions(+), 7 deletions(-) diff --git a/src/AzureOpenAIProxy.PlaygroundApp/Components/Pages/Tests.razor b/src/AzureOpenAIProxy.PlaygroundApp/Components/Pages/Tests.razor index dc54f2d8..69b8cc67 100644 --- a/src/AzureOpenAIProxy.PlaygroundApp/Components/Pages/Tests.razor +++ b/src/AzureOpenAIProxy.PlaygroundApp/Components/Pages/Tests.razor @@ -4,20 +4,22 @@ - -

Selected Value: @selectedModelValue

+ @code { - private string? selectedModelValue = ""; private object? currentValue; + private string? selectedModelValue = ""; - private void SetInput(int newValue) + private async Task SetInput(int newValue) { currentValue = newValue; + await Task.CompletedTask; } - private void HandleSelectedValue(string val) + private async Task HandleSelectedModelValue(string val) { selectedModelValue = val; + currentValue = selectedModelValue; + await Task.CompletedTask; } } diff --git a/src/AzureOpenAIProxy.PlaygroundApp/Components/UI/DeploymentModelListComponent.razor b/src/AzureOpenAIProxy.PlaygroundApp/Components/UI/DeploymentModelListComponent.razor index f0923b3f..8db3feee 100644 --- a/src/AzureOpenAIProxy.PlaygroundApp/Components/UI/DeploymentModelListComponent.razor +++ b/src/AzureOpenAIProxy.PlaygroundApp/Components/UI/DeploymentModelListComponent.razor @@ -1,5 +1,3 @@ -@using AzureOpenAIProxy.PlaygroundApp.Clients -
From f2d63f7accf844564a576be9196e9216e51a8621 Mon Sep 17 00:00:00 2001 From: yj_chun Date: Mon, 2 Sep 2024 13:41:24 +0900 Subject: [PATCH 22/22] =?UTF-8?q?DeploymentModelListComponent=20-=20Id=20?= =?UTF-8?q?=ED=8C=8C=EB=9D=BC=EB=AF=B8=ED=84=B0=20=EC=B6=94=EA=B0=80=20?= =?UTF-8?q?=EB=B0=8F=20Tests.razor=20=EC=BB=B4=ED=8F=AC=EB=84=8C=ED=8A=B8?= =?UTF-8?q?=EC=97=90=20Id=20=EA=B0=92=20=EC=A7=80=EC=A0=95,=20=ED=85=8C?= =?UTF-8?q?=EC=8A=A4=ED=8A=B8=20=EC=BD=94=EB=93=9C=20=EC=B6=94=EA=B0=80(Te?= =?UTF-8?q?stsPageTests,=20DeploymentModelListComponentTests)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Components/Pages/Tests.razor | 4 +-- .../UI/DeploymentModelListComponent.razor | 8 +++--- .../Pages/TestsPageTests.cs | 17 ++++++++++++ .../UI/DeploymentModelListComponentTests.cs | 27 ++++++++++++++----- 4 files changed, 44 insertions(+), 12 deletions(-) diff --git a/src/AzureOpenAIProxy.PlaygroundApp/Components/Pages/Tests.razor b/src/AzureOpenAIProxy.PlaygroundApp/Components/Pages/Tests.razor index 3574c564..dcc16730 100644 --- a/src/AzureOpenAIProxy.PlaygroundApp/Components/Pages/Tests.razor +++ b/src/AzureOpenAIProxy.PlaygroundApp/Components/Pages/Tests.razor @@ -5,7 +5,8 @@ - + + @code { private object? currentValue; @@ -20,7 +21,6 @@ private async Task HandleSelectedModelValue(string val) { selectedModelValue = val; - currentValue = selectedModelValue; await Task.CompletedTask; } } diff --git a/src/AzureOpenAIProxy.PlaygroundApp/Components/UI/DeploymentModelListComponent.razor b/src/AzureOpenAIProxy.PlaygroundApp/Components/UI/DeploymentModelListComponent.razor index 8db3feee..13783dd1 100644 --- a/src/AzureOpenAIProxy.PlaygroundApp/Components/UI/DeploymentModelListComponent.razor +++ b/src/AzureOpenAIProxy.PlaygroundApp/Components/UI/DeploymentModelListComponent.razor @@ -1,10 +1,10 @@ - +
- + *
- @code { + [Parameter] + public string? Id { get; set; } private Option? selectedOption { get; set; } = new(); [Parameter] diff --git a/test/AzureOpenAIProxy.PlaygroundApp.Tests/Pages/TestsPageTests.cs b/test/AzureOpenAIProxy.PlaygroundApp.Tests/Pages/TestsPageTests.cs index d9957c23..4acd2d1d 100644 --- a/test/AzureOpenAIProxy.PlaygroundApp.Tests/Pages/TestsPageTests.cs +++ b/test/AzureOpenAIProxy.PlaygroundApp.Tests/Pages/TestsPageTests.cs @@ -21,6 +21,23 @@ public async Task Setup() await Page.WaitForLoadStateAsync(LoadState.NetworkIdle); } + [Test] + [TestCase("debug-target")] + [TestCase("debug-button")] + [TestCase("deployment-model-list")] + [TestCase("debug-button-selected-model")] + public async Task Given_ComponentID_When_Page_Loaded_Then_Component_Should_Be_Visible(string id) + { + // Arrange + var expectedId = id; + + // Act + var component = Page.Locator($"#{expectedId}"); + + // Assert + await Expect(component).ToBeVisibleAsync(); + } + [Test] public async Task Given_No_Input_On_DebugTarget_When_DebugButton_Clicked_Then_Toast_Should_Show_NullMessage() { diff --git a/test/AzureOpenAIProxy.PlaygroundApp.Tests/UI/DeploymentModelListComponentTests.cs b/test/AzureOpenAIProxy.PlaygroundApp.Tests/UI/DeploymentModelListComponentTests.cs index c9a6aff2..d418011d 100644 --- a/test/AzureOpenAIProxy.PlaygroundApp.Tests/UI/DeploymentModelListComponentTests.cs +++ b/test/AzureOpenAIProxy.PlaygroundApp.Tests/UI/DeploymentModelListComponentTests.cs @@ -21,6 +21,19 @@ public async Task Init() await Page.WaitForLoadStateAsync(LoadState.NetworkIdle); } + [Test] + public async Task Given_DropdownComponentID_When_Page_Loaded_Then_DropdownComponent_Should_Be_Visible() + { + // Arrange + var expectedId = "deployment-model-list"; + + // Act + var component = Page.Locator($"#{expectedId}"); + + // Assert + await Expect(component).ToBeVisibleAsync(); + } + [Test] // 페이지에서 컴포넌트 레이블이 올바르게 표시되는지 확인 public async Task Given_Label_When_Page_Loaded_Then_Label_Should_Be_Visible() @@ -34,10 +47,10 @@ public async Task Given_Label_When_Page_Loaded_Then_Label_Should_Be_Visible() [Test] // 페이지에서 드롭다운 컴포넌트가 올바르게 표시되는지 확인 - public async Task Given_Dropdown_When_Page_Loaded_Then_Dropdown_Should_Be_Visible() + public async Task Given_DropdownList_When_Page_Loaded_Then_DropdownList_Should_Be_Visible() { // Act - var fluentSelect = Page.Locator("fluent-select#deployment-model-list"); + var fluentSelect = Page.Locator("fluent-select#deployment-model-list-options"); // Assert await Expect(fluentSelect).ToBeVisibleAsync(); @@ -45,10 +58,10 @@ public async Task Given_Dropdown_When_Page_Loaded_Then_Dropdown_Should_Be_Visibl [Test] // 드롭다운의 옵션 값이 존재하는지 확인 - public async Task Given_Dropdown_When_Dropdown_Clicked_And_DropdownOptions_Appeared_Then_All_DropdownOptions_Should_Be_Visible() + public async Task Given_DropdownList_When_DropdownList_Clicked_And_DropdownOptions_Appeared_Then_All_DropdownOptions_Should_Be_Visible() { // Arrange - var fluentSelect = Page.Locator("fluent-select#deployment-model-list"); + var fluentSelect = Page.Locator("fluent-select#deployment-model-list-options"); // Act await fluentSelect.ClickAsync(); @@ -61,16 +74,16 @@ public async Task Given_Dropdown_When_Dropdown_Clicked_And_DropdownOptions_Appea } } + [Test] [TestCase("AZ", 2)] [TestCase("CA", 4)] [TestCase("CT", 6)] [TestCase("FL", 8)] - [Test] // 드롭다운의 옵션 값을 선택하면 부모 컴포넌트(페이지 컴포넌트)에 올바르게 업데이트 되는지 확인 public async Task Given_DropdownOptions_And_ExpectedValue_When_Third_DropdownOption_Selected_And_DropdownValue_Updated_Then_DropdownValue_Should_Match_ExpectedValue(string exp, int n) { // Arrange - var fluentSelect = Page.Locator("fluent-select#deployment-model-list"); + var fluentSelect = Page.Locator("fluent-select#deployment-model-list-options"); await fluentSelect.ClickAsync(); var fluentOptions = fluentSelect.Locator("fluent-option"); var expectedValue = exp; // 실제 컴포넌트 옵션 값 @@ -78,7 +91,7 @@ public async Task Given_DropdownOptions_And_ExpectedValue_When_Third_DropdownOpt // Act await fluentOptions.Nth(n).ScrollIntoViewIfNeededAsync(); // 선택할 컴포넌트 옵션 보이도록 스크롤 await fluentOptions.Nth(n).ClickAsync(); // 옵션 클릭 - var actualValue = await Page.EvaluateAsync("() => document.querySelector('fluent-select#deployment-model-list').value"); // 페이지 내 컴포넌트 값 가져오기 + var actualValue = await Page.EvaluateAsync("() => document.querySelector('fluent-select#deployment-model-list-options').value"); // 페이지 내 컴포넌트 값 가져오기 // Assert actualValue.Should().Be(expectedValue);