@servicetitan/titan-chatbot-ui-cypress 3.1.1 → 3.1.2

package/src/tests/titan-chatbot-ui/chatbot-message-answer-readonly.shared-tests.tsx

@@ -1,187 +0,0 @@
-import { Container } from '@servicetitan/react-ioc';
-import { ChatMessageModelText, mockChatMessageModelText } from '@servicetitan/titan-chat-ui-common';
-import { CHATBOT_API_CLIENT, Models, ModelsMocks } from '@servicetitan/titan-chatbot-api';
-import { FC, ReactElement } from 'react';
-import { CypressMocks, testInitContainerChatbot, testRenderWrapperChatbot } from '../..';
-import { ChatUiSelectors } from '../../utils/chat-ui-selectors';
-
-interface IChatbotMessageAnswerReadonlyProps {
-    message: ChatMessageModelText;
-}
-
-export function runChatbotMessageAnswerReadonlySharedTests(
-    ChatbotMessageAnswerReadonlyComponent: FC<IChatbotMessageAnswerReadonlyProps>,
-    wrapperComponent?: (component: ReactElement) => ReactElement
-) {
-    let container: Container;
-    let api: CypressMocks.ChatbotApiClientMock;
-
-    const mockApiClient = () => {
-        api.postSession = cy.stub().resolves(ModelsMocks.mockSession());
-        api.getOptions = cy.stub().resolves(ModelsMocks.mockFrontendModel());
-    };
-
-    beforeEach(() => {
-        container = testInitContainerChatbot();
-        api = container.get<CypressMocks.ChatbotApiClientMock>(CHATBOT_API_CLIENT);
-        mockApiClient();
-        cy.viewport(550, 800);
-    });
-
-    const render = (message: ChatMessageModelText, onAfterInit?: () => void) => {
-        return cy.wrap(null).then(() => {
-            const component = <ChatbotMessageAnswerReadonlyComponent message={message} />;
-            const wrappedComponent = wrapperComponent ? wrapperComponent(component) : component;
-
-            return testRenderWrapperChatbot(container, wrappedComponent, onAfterInit);
-        });
-    };
-
-    it('should render basic readonly message answer', () => {
-        const message = mockChatMessageModelText(false, {
-            message: 'This is a readonly answer from the chatbot',
-        });
-
-        render(message);
-
-        cy.contains('This is a readonly answer from the chatbot').should('be.visible');
-    });
-
-    it('should render multiline text correctly', () => {
-        const multilineMessage = 'Line 1\nLine 2\nLine 3';
-        const message = mockChatMessageModelText(false, {
-            message: multilineMessage,
-        });
-
-        render(message);
-
-        cy.contains('Line 1').should('be.visible');
-        cy.contains('Line 2').should('be.visible');
-        cy.contains('Line 3').should('be.visible');
-    });
-
-    it('should render readonly message without bot message data', () => {
-        const message = mockChatMessageModelText(false, {
-            message: 'Simple readonly answer',
-            data: undefined,
-        });
-
-        render(message);
-
-        cy.contains('Simple readonly answer').should('be.visible');
-
-        // Should not render links when no bot message data
-        ChatUiSelectors.chatbotLinksLink.should('not.exist');
-    });
-
-    it('should render readonly message with bot message data but no links', () => {
-        const botMessageWithoutLinks: Models.IBotMessageWithFeedback = {
-            ...ModelsMocks.mockBotMessage({ answer: 'Answer without links' }),
-            scoredUrls: [],
-        };
-
-        const message = mockChatMessageModelText(false, {
-            message: 'Answer without links',
-            data: botMessageWithoutLinks,
-        });
-
-        render(message);
-
-        cy.contains('Answer without links').should('be.visible');
-
-        // Should not render links when scoredUrls is empty
-        ChatUiSelectors.chatbotLinksCollapsible.should('not.exist');
-    });
-
-    it('should render readonly message with bot message data and links', () => {
-        const botMessageWithFeedback: Models.IBotMessageWithFeedback = {
-            ...ModelsMocks.mockBotMessage({ answer: 'Readonly answer with links' }),
-            scoredUrls: [
-                ModelsMocks.mockScoredUrl({
-                    url: 'https://example.com/article1',
-                    title: 'Example Article 1',
-                    score: 0.9,
-                }),
-                ModelsMocks.mockScoredUrl({
-                    url: 'https://example.com/article2',
-                    title: 'Example Article 2',
-                    score: 0.8,
-                }),
-                ModelsMocks.mockScoredUrl({
-                    url: 'https://example.com/article3',
-                    title: 'Example Article 3',
-                    score: 0.7,
-                }),
-            ],
-        };
-
-        const message = mockChatMessageModelText(false, {
-            message: 'Readonly answer with links',
-            data: botMessageWithFeedback,
-        });
-
-        render(message);
-
-        cy.contains('Readonly answer with links').should('be.visible');
-
-        // Check that links are rendered with correct labels
-        ChatUiSelectors.chatbotLinksMore.should('contain.text', 'Learn more').click();
-        ChatUiSelectors.chatbotLinksLink.should('be.visible');
-    });
-
-    it('should render readonly message with bot message data and single link', () => {
-        const botMessageWithSingleLink: Models.IBotMessageWithFeedback = {
-            ...ModelsMocks.mockBotMessage({ answer: 'Answer with single link' }),
-            scoredUrls: [
-                ModelsMocks.mockScoredUrl({
-                    url: 'https://example.com/single-article',
-                    title: 'Single Article',
-                    score: 0.95,
-                }),
-            ],
-        };
-
-        const message = mockChatMessageModelText(false, {
-            message: 'Answer with single link',
-            data: botMessageWithSingleLink,
-        });
-
-        render(message);
-
-        cy.contains('Answer with single link').should('be.visible');
-
-        // Check that single link is rendered
-        ChatUiSelectors.chatbotLinksMore.should('be.visible').click();
-        ChatUiSelectors.chatbotLinksLink.should('have.length', 1);
-    });
-
-    it('should handle null/undefined scoredUrls gracefully', () => {
-        const botMessageWithNullUrls: Models.IBotMessageWithFeedback = {
-            ...ModelsMocks.mockBotMessage({ answer: 'Answer with null URLs' }),
-            scoredUrls: null as any,
-        };
-
-        const message = mockChatMessageModelText(false, {
-            message: 'Answer with null URLs',
-            data: botMessageWithNullUrls,
-        });
-
-        render(message);
-
-        cy.contains('Answer with null URLs').should('be.visible');
-
-        // Should not render links when scoredUrls is null
-        ChatUiSelectors.chatbotLinksCollapsible.should('not.exist');
-    });
-
-    it('should render empty message gracefully', () => {
-        const message = mockChatMessageModelText(false, {
-            message: '',
-        });
-
-        render(message);
-
-        // Component should still render even with empty message
-        cy.get('body').should('be.visible');
-    });
-}

package/src/tests/titan-chatbot-ui/chatbot-message-answer.shared-tests.tsx

@@ -1,144 +0,0 @@
-import { Container } from '@servicetitan/react-ioc';
-import { ChatMessageModelText, mockChatMessageModelText } from '@servicetitan/titan-chat-ui-common';
-import {
-    CHATBOT_API_CLIENT,
-    CHATBOT_UI_STORE_TOKEN,
-    ChatbotUiStore,
-    IChatbotUiStore,
-    Models,
-    ModelsMocks,
-} from '@servicetitan/titan-chatbot-api';
-import { FC, ReactElement } from 'react';
-import { CypressMocks, testInitContainerChatbot, testRenderWrapperChatbot } from '../..';
-import { ChatUiSelectors } from '../../utils/chat-ui-selectors';
-
-interface IChatbotMessageAnswerProps {
-    message: ChatMessageModelText;
-}
-
-export function runChatbotMessageAnswerSharedTests(
-    ChatbotMessageAnswerComponent: FC<IChatbotMessageAnswerProps>,
-    wrapperComponent?: (component: ReactElement) => ReactElement
-) {
-    let container: Container;
-    let api: CypressMocks.ChatbotApiClientMock;
-    let chatbotUiStore: IChatbotUiStore;
-
-    const mockApiClient = () => {
-        api.postSession = cy.stub().resolves(ModelsMocks.mockSession());
-        api.getOptions = cy.stub().resolves(ModelsMocks.mockFrontendModel());
-    };
-
-    beforeEach(() => {
-        container = testInitContainerChatbot();
-        api = container.get<CypressMocks.ChatbotApiClientMock>(CHATBOT_API_CLIENT);
-        chatbotUiStore = container.get<ChatbotUiStore>(CHATBOT_UI_STORE_TOKEN);
-        mockApiClient();
-        cy.viewport(550, 800);
-    });
-
-    const render = (message: ChatMessageModelText, onAfterInit?: () => void) => {
-        return cy.wrap(null).then(() => {
-            const component = <ChatbotMessageAnswerComponent message={message} />;
-            const wrappedComponent = wrapperComponent ? wrapperComponent(component) : component;
-
-            return testRenderWrapperChatbot(container, wrappedComponent, onAfterInit);
-        });
-    };
-
-    it('should render basic message answer', () => {
-        const message = mockChatMessageModelText(false, {
-            message: 'This is a test answer from the chatbot',
-        });
-
-        render(message);
-
-        ChatUiSelectors.chatbotMessageAnswer.should('be.visible');
-        ChatUiSelectors.chatbotMessageAnswer.should(
-            'contain.text',
-            'This is a test answer from the chatbot'
-        );
-    });
-
-    it('should render message answer with bot message data and links', () => {
-        const botMessageWithFeedback: Models.IBotMessageWithFeedback = {
-            ...ModelsMocks.mockBotMessage({ answer: 'Test answer with links' }),
-            scoredUrls: [
-                ModelsMocks.mockScoredUrl({
-                    url: 'https://example.com/article1',
-                    title: 'Example Article 1',
-                    score: 0.9,
-                }),
-                ModelsMocks.mockScoredUrl({
-                    url: 'https://example.com/article2',
-                    title: 'Example Article 2',
-                    score: 0.8,
-                }),
-            ],
-        };
-
-        const message = mockChatMessageModelText(false, {
-            message: 'Test answer with links',
-            data: botMessageWithFeedback,
-        });
-
-        render(message);
-
-        ChatUiSelectors.chatbotMessageAnswer.should('be.visible');
-        ChatUiSelectors.chatbotMessageAnswer.should('contain.text', 'Test answer with links');
-
-        // Check that links are rendered
-        ChatUiSelectors.chatbotLinksMore.should('contain.text', 'Learn more').click();
-        ChatUiSelectors.chatbotLinksLink.should('be.visible');
-    });
-
-    it('should render multiline text correctly', () => {
-        const multilineMessage = 'Line 1\nLine 2\nLine 3';
-        const message = mockChatMessageModelText(false, {
-            message: multilineMessage,
-        });
-
-        render(message);
-
-        ChatUiSelectors.chatbotMessageAnswer.should('be.visible');
-        ChatUiSelectors.chatbotMessageAnswer.should('contain.text', 'Line 1');
-        ChatUiSelectors.chatbotMessageAnswer.should('contain.text', 'Line 2');
-        ChatUiSelectors.chatbotMessageAnswer.should('contain.text', 'Line 3');
-    });
-
-    it('should trigger scroll when links are toggled for last message', () => {
-        const botMessageWithFeedback: Models.IBotMessageWithFeedback = {
-            ...ModelsMocks.mockBotMessage({ answer: 'Last message with links' }),
-            scoredUrls: [
-                ModelsMocks.mockScoredUrl({
-                    url: 'https://example.com/article',
-                    title: 'Example Article',
-                    score: 0.9,
-                }),
-            ],
-        };
-
-        const message = mockChatMessageModelText(false, {
-            message: 'Last message with links',
-            data: botMessageWithFeedback,
-        });
-
-        render(message, () => {
-            // Set this message as the last message in the store
-            chatbotUiStore.setMessages([message]);
-        });
-
-        cy.wait(1).then(() => {
-            // Verify the message is the last one in the store
-            expect(chatbotUiStore.messages.at(-1)?.id).to.equal(message.id);
-        });
-
-        ChatUiSelectors.chatbotMessageAnswer.should('be.visible');
-
-        // Toggle links to trigger scroll
-        ChatUiSelectors.chatbotLinksMore.click();
-
-        // Verify scroll was triggered (this would be implementation-specific)
-        cy.wait(150); // Wait for setTimeout to complete
-    });
-}

package/src/tests/titan-chatbot-ui/chatbot-message-feedback-form-guardrail.shared-tests.tsx

@@ -1,127 +0,0 @@
-import { Container, Provider, useDependencies } from '@servicetitan/react-ioc';
-import {
-    CHATBOT_API_CLIENT,
-    MessageFeedbackGuardrailStore,
-    ModelsMocks,
-} from '@servicetitan/titan-chatbot-api';
-import { FC, ReactElement } from 'react';
-import { CypressMocks, testInitContainerChatbot, testRenderWrapperChatbot } from '../..';
-import { ChatUiSelectors } from '../../utils/chat-ui-selectors';
-
-export function runChatbotMessageFeedbackFormGuardrailSharedTests(
-    ChatbotMessageFeedbackFormGuardrailComponent: FC,
-    wrapperComponent?: (component: ReactElement) => ReactElement
-) {
-    let container: Container;
-    let api: CypressMocks.ChatbotApiClientMock;
-    let messageFeedbackGuardrailStore: MessageFeedbackGuardrailStore;
-
-    const mockApiClient = () => {
-        api.postSession = cy.stub().resolves(ModelsMocks.mockSession());
-        api.getOptions = cy.stub().resolves(ModelsMocks.mockFrontendModel());
-    };
-
-    beforeEach(() => {
-        container = testInitContainerChatbot();
-        container.bind(MessageFeedbackGuardrailStore).toSelf().inSingletonScope();
-        api = container.get<CypressMocks.ChatbotApiClientMock>(CHATBOT_API_CLIENT);
-        messageFeedbackGuardrailStore = container.get(MessageFeedbackGuardrailStore);
-        mockApiClient();
-        cy.viewport(550, 800);
-    });
-
-    const getFormError = () => cy.get('[data-anvil-component="Banner"]');
-    const checkValid = () => {
-        cy.getCy('validator').click();
-        getFormError().should('not.exist');
-    };
-    const checkInvalid = () => {
-        cy.getCy('validator').click();
-        getFormError().should('be.visible');
-    };
-
-    const render = (onAfterInit?: () => void) => {
-        return cy.wrap(null).then(() => {
-            const Validator: FC = () => {
-                const [formStore] = useDependencies(MessageFeedbackGuardrailStore);
-                return (
-                    <button
-                        className="m-t-3"
-                        data-cy="validator"
-                        onClick={() => formStore.formState.validate()}
-                    >
-                        Validate
-                    </button>
-                );
-            };
-
-            const component = (
-                <Provider
-                    singletons={[
-                        {
-                            provide: MessageFeedbackGuardrailStore,
-                            useValue: messageFeedbackGuardrailStore,
-                        },
-                    ]}
-                >
-                    <ChatbotMessageFeedbackFormGuardrailComponent />
-                    <Validator />
-                </Provider>
-            );
-
-            const wrappedComponent = wrapperComponent ? wrapperComponent(component) : component;
-
-            return testRenderWrapperChatbot(container, wrappedComponent, onAfterInit);
-        });
-    };
-
-    it('should render form', () => {
-        render();
-
-        ChatUiSelectors.chatbotMessageFeedback.should('be.visible');
-        ChatUiSelectors.chatbotMessageFeedbackLinkUrl.should('be.visible');
-        ChatUiSelectors.chatbotMessageFeedbackOtherComment.should('be.visible');
-        checkInvalid();
-        getFormError().find('.Banner__title').should('contain.text', 'Form Incomplete');
-        getFormError()
-            .find('ul > li')
-            .should('contain.text', 'At least one input must be provided.');
-
-        ChatUiSelectors.chatbotMessageFeedbackLinkUrl.type('https://example.com');
-        checkValid();
-
-        ChatUiSelectors.chatbotMessageFeedbackLinkUrl.clear();
-        checkInvalid();
-
-        ChatUiSelectors.chatbotMessageFeedbackOtherComment.type('Test comment');
-        checkValid();
-    });
-
-    it('should validate form when both fields are filled', () => {
-        render();
-
-        ChatUiSelectors.chatbotMessageFeedbackLinkUrl.type('https://example.com');
-        ChatUiSelectors.chatbotMessageFeedbackOtherComment.type('Additional feedback comment');
-        checkValid();
-    });
-
-    it('should show error when form is submitted empty', () => {
-        render();
-
-        checkInvalid();
-        getFormError().should('be.visible');
-        getFormError().find('.Banner__title').should('contain.text', 'Form Incomplete');
-    });
-
-    it('should clear validation error when valid input is provided', () => {
-        render();
-
-        // First show the error
-        checkInvalid();
-        getFormError().should('be.visible');
-
-        // Then provide valid input
-        ChatUiSelectors.chatbotMessageFeedbackLinkUrl.type('https://valid-url.com');
-        checkValid();
-    });
-}

package/src/tests/titan-chatbot-ui/chatbot-message-feedback-form.shared-tests.tsx

@@ -1,198 +0,0 @@
-import { Container, Provider, useDependencies } from '@servicetitan/react-ioc';
-import {
-    CHATBOT_API_CLIENT,
-    CHATBOT_UI_STORE_TOKEN,
-    ChatbotUiStore,
-    IChatbotUiStore,
-    MessageFeedbackStore,
-    ModelsMocks,
-} from '@servicetitan/titan-chatbot-api';
-import { FC, ReactElement } from 'react';
-import { CypressMocks, testInitContainerChatbot, testRenderWrapperChatbot } from '../..';
-import { ChatUiSelectors } from '../../utils/chat-ui-selectors';
-
-export function runChatbotMessageFeedbackFormSharedTests(
-    ChatbotMessageFeedbackFormComponent: FC,
-    wrapperComponent?: (component: ReactElement) => ReactElement
-) {
-    let container: Container;
-    let api: CypressMocks.ChatbotApiClientMock;
-    let chatbotUiStore: IChatbotUiStore;
-    let messageFeedbackStore: MessageFeedbackStore;
-
-    const mockApiClient = () => {
-        api.postSession = cy.stub().resolves(ModelsMocks.mockSession());
-        api.getOptions = cy.stub().resolves(ModelsMocks.mockFrontendModel());
-    };
-
-    beforeEach(() => {
-        container = testInitContainerChatbot();
-        container.bind<MessageFeedbackStore>(MessageFeedbackStore).toSelf().inSingletonScope();
-        api = container.get<CypressMocks.ChatbotApiClientMock>(CHATBOT_API_CLIENT);
-        chatbotUiStore = container.get<ChatbotUiStore>(CHATBOT_UI_STORE_TOKEN);
-        messageFeedbackStore = container.get<MessageFeedbackStore>(MessageFeedbackStore);
-        mockApiClient();
-        cy.viewport(550, 800);
-    });
-
-    const getFormError = () =>
-        ChatUiSelectors.chatbotMessageFeedback.find(
-            '.FormField__errorText,[class^="_error-container"]'
-        );
-    const checkValid = () => {
-        cy.getCy('validator').click();
-        getFormError().should('not.exist');
-    };
-    const checkInvalid = () => {
-        cy.getCy('validator').click();
-        getFormError().should('be.visible');
-    };
-
-    const render = (onAfterInit?: () => void) => {
-        return cy.wrap(null).then(() => {
-            const Validator: FC = () => {
-                const [formStore] = useDependencies(MessageFeedbackStore);
-                return (
-                    <button
-                        style={{ marginTop: '20px' }}
-                        data-cy="validator"
-                        onClick={() => formStore.formState.validate()}
-                    >
-                        Validate
-                    </button>
-                );
-            };
-
-            const component = (
-                <Provider
-                    singletons={[
-                        {
-                            provide: MessageFeedbackStore,
-                            useValue: messageFeedbackStore,
-                        },
-                    ]}
-                >
-                    <ChatbotMessageFeedbackFormComponent />
-                    <Validator />
-                </Provider>
-            );
-
-            const wrappedComponent = wrapperComponent ? wrapperComponent(component) : component;
-
-            return testRenderWrapperChatbot(container, wrappedComponent, onAfterInit);
-        });
-    };
-
-    it('should render default state external', () => {
-        render();
-        cy.clock(Date.parse('2023-10-01T00:00:00Z'));
-
-        // Default render
-        ChatUiSelectors.chatbotMessageFeedback.should('be.visible');
-        ChatUiSelectors.chatbotMessageFeedbackUnrelated.should('be.visible');
-        ChatUiSelectors.chatbotMessageFeedbackUnclear.should('be.visible');
-        ChatUiSelectors.chatbotMessageFeedbackNotFull.should('be.visible');
-        ChatUiSelectors.chatbotMessageFeedbackIncorrect.should('be.visible');
-        ChatUiSelectors.chatbotMessageFeedbackOther.should('be.visible');
-        ChatUiSelectors.chatbotMessageFeedbackOtherComment.should('not.exist');
-        checkValid();
-
-        // Click 'other' and check comment textarea
-        ChatUiSelectors.chatbotMessageFeedbackOther.parent().find('input').click({ force: true });
-        ChatUiSelectors.chatbotMessageFeedbackOtherComment
-            .should('be.visible')
-            .type('Test comment');
-        getFormError().should('not.exist');
-        checkValid();
-
-        ChatUiSelectors.chatbotMessageFeedbackOtherComment.clear().blur();
-        getFormError().should('be.visible').should('contain.text', 'Enter details.');
-        checkInvalid();
-    });
-
-    it('should render default state internal', () => {
-        render(() => {
-            chatbotUiStore.customizations.feedback = {
-                isCommentAlwaysRequired: true,
-            };
-        });
-        cy.clock(Date.parse('2023-10-01T00:00:00Z'));
-
-        // Default render
-        ChatUiSelectors.chatbotMessageFeedback.should('be.visible');
-        ChatUiSelectors.chatbotMessageFeedbackUnrelated.should('be.visible');
-        ChatUiSelectors.chatbotMessageFeedbackUnclear.should('be.visible');
-        ChatUiSelectors.chatbotMessageFeedbackNotFull.should('be.visible');
-        ChatUiSelectors.chatbotMessageFeedbackIncorrect.should('be.visible');
-        ChatUiSelectors.chatbotMessageFeedbackOther.should('be.visible');
-        ChatUiSelectors.chatbotMessageFeedbackOtherComment.should('be.visible');
-        checkInvalid();
-
-        // Don't click 'other' and check comment textarea: should be mandatory
-        ChatUiSelectors.chatbotMessageFeedbackOtherComment.focus().blur();
-        getFormError().should('be.visible').should('contain.text', 'Enter details.');
-        checkInvalid();
-
-        ChatUiSelectors.chatbotMessageFeedbackOtherComment.type('Test comment');
-        checkValid();
-    });
-
-    it('should validate form when selecting feedback option without other', () => {
-        render();
-        cy.clock(Date.parse('2023-10-01T00:00:00Z'));
-
-        ChatUiSelectors.chatbotMessageFeedbackUnrelated
-            .parent()
-            .find('input')
-            .click({ force: true });
-        checkValid();
-
-        ChatUiSelectors.chatbotMessageFeedbackUnclear.parent().find('input').click({ force: true });
-        checkValid();
-
-        ChatUiSelectors.chatbotMessageFeedbackIncorrect
-            .parent()
-            .find('input')
-            .click({ force: true });
-        checkValid();
-    });
-
-    it('should handle multiple selection changes', () => {
-        render();
-        cy.clock(Date.parse('2023-10-01T00:00:00Z'));
-
-        // First select a standard option
-        ChatUiSelectors.chatbotMessageFeedbackUnrelated
-            .parent()
-            .find('input')
-            .click({ force: true });
-        checkValid();
-
-        // Then switch to 'other' option
-        ChatUiSelectors.chatbotMessageFeedbackOther.parent().find('input').click({ force: true });
-        ChatUiSelectors.chatbotMessageFeedbackOtherComment.should('be.visible');
-
-        // Should be invalid without comment
-        ChatUiSelectors.chatbotMessageFeedbackOtherComment.focus().blur();
-        getFormError().should('be.visible').should('contain.text', 'Enter details.');
-        checkInvalid();
-
-        // Add comment and validate
-        ChatUiSelectors.chatbotMessageFeedbackOtherComment.type('Custom feedback');
-        checkValid();
-    });
-
-    it('should show error when other is selected but comment is cleared', () => {
-        render();
-        cy.clock(Date.parse('2023-10-01T00:00:00Z'));
-
-        ChatUiSelectors.chatbotMessageFeedbackOther.parent().find('input').click({ force: true });
-        ChatUiSelectors.chatbotMessageFeedbackOtherComment.type('Initial comment');
-        checkValid();
-
-        // Clear the comment
-        ChatUiSelectors.chatbotMessageFeedbackOtherComment.clear().blur();
-        getFormError().should('be.visible').should('contain.text', 'Enter details.');
-        checkInvalid();
-    });
-}