diff --git a/src/DialogueEditor/components/Explorer/components/Preview/components/DynamicContentCheckbox/DynamicContentCheckbox.test.luau b/src/DialogueEditor/components/Explorer/components/Preview/components/DynamicContentCheckbox/DynamicContentCheckbox.test.luau new file mode 100644 index 00000000..88f29c51 --- /dev/null +++ b/src/DialogueEditor/components/Explorer/components/Preview/components/DynamicContentCheckbox/DynamicContentCheckbox.test.luau @@ -0,0 +1,187 @@ +--!strict + +local root = script.Parent.Parent.Parent.Parent.Parent.Parent.Parent.Parent; +local DynamicContentCheckbox = require(script.Parent); +local VirtualService = require(root.VirtualService); +local React = require(root.roblox_packages.react); +local ReactErrorBoundary = require(root.roblox_packages.ReactErrorBoundary); +local ErrorBoundary = ReactErrorBoundary.ErrorBoundary; +local ReactRoblox = require(root.roblox_packages["react-roblox"]); +local IJW = require(root.roblox_packages.ijw); +local expect = IJW.expect; +local describe = IJW.describe; +local it = IJW.it; +local VirtualSelection = require(root.DialogueEditor.mocks.Selection); +local VirtualChangeHistoryService = require(root.DialogueEditor.mocks.ChangeHistoryService); + +local screenGui: ScreenGui?; +local reactRoot: ReactRoblox.RootType?; +local propagatedErrorMessage; +local eventConnection: RBXScriptConnection?; + +return { + + describe("DynamicContentCheckbox", function() + + local function MockComponent(properties: any) + + local selectedScript = properties.selectedScript; + local onErrored = properties.onErrored or function() end; + local onRendered = properties.onRendered or function() end; + + React.useEffect(function() + + onRendered(); + + end, {onRendered}); + + return React.createElement(ErrorBoundary, { + FallbackComponent = React.Fragment; + onError = onErrored; + }, { + React.createElement(DynamicContentCheckbox, { + selectedScript = selectedScript; + layoutOrder = 1; + }) + }); + + end; + + local function verifyReactStatus() + + if propagatedErrorMessage then + + error(propagatedErrorMessage); + + end; + + end; + + local function createDialogueScript(type: "Conversation" | "Message" | "Redirect") + + local dialogueScript = Instance.new("ModuleScript"); + + if type == "Conversation" then + + dialogueScript:AddTag("DialogueMakerConversationScript"); + + else + + dialogueScript:AddTag("DialogueMakerDialogueScript"); + dialogueScript:SetAttribute("DialogueType", type); + + end; + + return dialogueScript; + + end; + + local function render(type: "Conversation" | "Message" | "Redirect"): ModuleScript + + assert(reactRoot, "React root should be initialized before running tests."); + + local selectedScript = createDialogueScript(type); + local didRender = false; + local element = React.createElement(MockComponent, { + selectedScript = selectedScript; + onErrored = function(errorMessage) + + propagatedErrorMessage = errorMessage; + + end; + onRendered = function() + + didRender = true; + + end; + }); + + reactRoot:render(element); + repeat task.wait() until didRender or propagatedErrorMessage; + verifyReactStatus(); + + return selectedScript; + + end; + + return { + + it("can create ContentScript if it doesn't exist", function() + + expect(function() + + local selectedScript = render("Message"); + + assert(screenGui, "ScreenGui should be initialized before running tests."); + local dynamicContentCheckbox = screenGui:FindFirstChildOfClass("Frame"); + assert(dynamicContentCheckbox, "DynamicContentCheckbox should be rendered."); + + local checkbox = dynamicContentCheckbox:FindFirstChild("Checkbox"); + assert(checkbox and checkbox:IsA("TextButton"), "Checkbox should be rendered inside DynamicContentCheckbox."); + + VirtualService.events.GuiButton.Activated:fireEvent(checkbox); + selectedScript:WaitForChild("ContentScript"); + + end).toFinishBeforeSeconds(1); + + end); + + } + + end, { + beforeEach = function() + + local newScreenGui = Instance.new("ScreenGui"); + screenGui = newScreenGui; + reactRoot = ReactRoblox.createRoot(newScreenGui); + + local virtualSelection = VirtualSelection.new(); + local virtualChangeHistoryService = VirtualChangeHistoryService.new(); + VirtualService.globals.game = { + GetService = function(self, serviceName: string): unknown + + if serviceName == "Selection" then + + return virtualSelection; + + elseif serviceName == "ChangeHistoryService" then + + return virtualChangeHistoryService; + + end; + + return game:GetService(serviceName); + + end; + }; + + end; + afterEach = function() + + if reactRoot then + + reactRoot:unmount(); + reactRoot = nil; + + end; + + if screenGui then + + screenGui:Destroy(); + screenGui = nil; + + end; + + if eventConnection then + + eventConnection:Disconnect(); + eventConnection = nil; + + end; + + propagatedErrorMessage = nil; + VirtualService.globals.game = game; + + end; + }) +}; \ No newline at end of file diff --git a/src/DialogueEditor/components/Explorer/components/Preview/components/DynamicContentCheckbox/init.luau b/src/DialogueEditor/components/Explorer/components/Preview/components/DynamicContentCheckbox/init.luau index bb39c1ec..e6440d9d 100644 --- a/src/DialogueEditor/components/Explorer/components/Preview/components/DynamicContentCheckbox/init.luau +++ b/src/DialogueEditor/components/Explorer/components/Preview/components/DynamicContentCheckbox/init.luau @@ -4,25 +4,23 @@ local root = script.Parent.Parent.Parent.Parent.Parent.Parent.Parent; local React = require(root.roblox_packages.react); local Checkbox = require(root.DialogueEditor.components.Checkbox); local useChangeHistory = require(root.DialogueEditor.hooks.useChangeHistory); +local useDialogueContentScript = require(script.Parent.Parent.hooks.useDialogueContentScript); export type DynamicContentCheckboxProperties = { selectedScript: ModuleScript; - isChecked: boolean; - dialogueContentScript: ModuleScript?; layoutOrder: number; } local function DynamicContentCheckbox(properties: DynamicContentCheckboxProperties) local selectedScript = properties.selectedScript; - local isChecked = properties.isChecked; - local dialogueContentScript = properties.dialogueContentScript; + local dialogueContentScript, isDialogueContentScriptEnabled = useDialogueContentScript(selectedScript); local layoutOrder = properties.layoutOrder; local beginHistoryRecording, finishHistoryRecording = useChangeHistory(); return React.createElement(Checkbox, { text = "Dynamic content"; - isChecked = isChecked; + isChecked = isDialogueContentScriptEnabled; layoutOrder = layoutOrder; onChanged = function(isChecked: boolean) diff --git a/src/DialogueEditor/components/Explorer/components/Preview/init.luau b/src/DialogueEditor/components/Explorer/components/Preview/init.luau index 0d8b9740..b5a9005c 100644 --- a/src/DialogueEditor/components/Explorer/components/Preview/init.luau +++ b/src/DialogueEditor/components/Explorer/components/Preview/init.luau @@ -84,8 +84,6 @@ local function Preview(properties: PreviewProperties) React.createElement(DynamicContentCheckbox, { layoutOrder = 3; selectedScript = selectedScript; - isChecked = isDialogueContentScriptEnabled; - dialogueContentScript = dialogueContentScript; }) else nil; });