0% found this document useful (0 votes)
8 views13 pages

IT Problem Solving Test: Frontend Focus

The document outlines a Problem Solving Test for IT focused on frontend development, specifically for a Responsible Gaming Dashboard. It includes a series of close-ended questions that assess knowledge in JavaScript, TypeScript, and responsive design principles. The questions cover event listeners, array filtering, asynchronous operations, and layout behavior among other topics.

Uploaded by

Tonyy Mich
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
8 views13 pages

IT Problem Solving Test: Frontend Focus

The document outlines a Problem Solving Test for IT focused on frontend development, specifically for a Responsible Gaming Dashboard. It includes a series of close-ended questions that assess knowledge in JavaScript, TypeScript, and responsive design principles. The questions cover event listeners, array filtering, asynchronous operations, and layout behavior among other topics.

Uploaded by

Tonyy Mich
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd

2/12/25, 12:25 PM Problem Solving Test | IT

Problem Solving Test | IT

Close-ended questions. Frontend


development.

In the Responsible Gaming Dashboard, the development team


is tasked with building interactive, responsive, and secure
frontend components. These components include user activity
visualization, responsible gaming alerts, and customer profile
management.

4. You need to add an event listener to a button that displays a


user alert when clicked. Identify the correct code snippet to
achieve this.

⚪ [Link]('onClick', () =>
alert('Button clicked!'));

⚪ [Link]('click', () => alert('Button


clicked!'));

⚫ [Link]('click', () =>
alert('Button clicked!'));

⚪ [Link](() => alert('Button clicked!'));

[Link] 1/13
2/12/25, 12:25 PM Problem Solving Test | IT

⚪ [Link](() => alert('Button


clicked!'));

5. You need to filter an array of bet amounts to display only


those greater than $100. What code snippet achieves this?

⚫ [Link]((bet) => bet > 100);


⚪ [Link]((bet) => bet > 100);
⚪ [Link]((bet) => bet > 100);
⚪ [Link]((a, b) => a - b > 100);
⚪ [Link]((acc, bet) => bet > 100 ?
[Link](bet) : acc, []);

[Link] 2/13
2/12/25, 12:25 PM Problem Solving Test | IT

6. You need to fetch a customer’s profile data from the server.


What code snippet correctly handles the asynchronous
operation using fetch?

⚪ await [Link]();
⚪ [Link](response);
⚪ await [Link]();
⚪ [Link]();
⚪ [Link]();

[Link] 3/13
2/12/25, 12:25 PM Problem Solving Test | IT

7. Complete the code below to define a TypeScript interface for


a Customer and use it in the function to return a formatted
profile string.

⚪ { Customer { id: number; name: string; total:


number; } }

⚪ { Customer { id: number; name: string;


totalWagered: number; } }

[Link] 4/13
2/12/25, 12:25 PM Problem Solving Test | IT

⚪ { id: number; name: string; totalWagered:


number; }

⚪ { Customer { customerId: number; fullName:


string; totalWagered: number; } }

⚪ { CustomerProfile { id: number; name: string;


totalWagered: number; } }

[Link] 5/13
2/12/25, 12:25 PM Problem Solving Test | IT

8. You are implementing a utility function for the Responsible


Gaming Dashboard to find the top customer based on a given
key (e.g., totalWagered or sessionDuration). The function
should be reusable for objects with varying properties.
Complete the code below to create a generic function that finds
the top element based on a key.

⚪ key: keyof T
⚪ key: T
⚪ key: string
⚪ key: keyof Customer

[Link] 6/13
2/12/25, 12:25 PM Problem Solving Test | IT

⚪ key: keyof typeof T

[Link] 7/13
2/12/25, 12:25 PM Problem Solving Test | IT

9. In the Responsible Gaming Dashboard, the frontend team is


working on a responsive card layout for displaying key
customer information. This layout contains a left section for
customer avatars, a center section for primary details (e.g.,
name and activity stats), and a right section for action buttons.

You are tasked with analyzing how the card layout behaves
when the screen size decreases. The card contains three
sections: left, center, and right, styled using Flexbox.
Understanding this behavior is crucial for ensuring the
dashboard's responsiveness across devices.

[Link] 8/13
2/12/25, 12:25 PM Problem Solving Test | IT

⚪ The center section will shrink first, followed by


left and right.

⚪ Only the center section will shrink; left and right


will remain unchanged.

⚪ Only the left and right sections will shrink; the


center section will remain unchanged.

⚪ All sections will shrink simultaneously.


⚪ The right and left sections will shrink first,
followed by the center section.

[Link] 9/13
2/12/25, 12:25 PM Problem Solving Test | IT

10. You are reviewing the following HTML code, which is part of
a categorized list of customer activity. What is incorrect about
this code snippet?

⚪ A closing tag is missing in the < li > tag for


Responsible Gaming Alerts.

⚪ Nested unordered lists (< ul >) cannot be placed


inside ordered lists (< ol >).

⚪ The < p > tag cannot be nested inside the < ol


> list.

⚪ The < ol > tag is missing the required type


attribute.

⚪ The < li > tags are missing the required value


attribute.

[Link] 10/13
2/12/25, 12:25 PM Problem Solving Test | IT

11. You are tasked with adjusting the layout of the top
navigation using Flexbox to make the logo align to the left and
the links align to the right. Which CSS rule would achieve this?

⚪ Set logo with flex: 1;


⚪ Set logo with width: max-content;
⚪ Set parent with min-width: max-content;
⚪ Set parent with justify-content: space-between;
⚪ Set links with align-items: center;

[Link] 11/13
2/12/25, 12:25 PM Problem Solving Test | IT

12. Review the HTML code for a basic form and choose the
correct statement about its behavior:

⚪ The form sends data to the server at /register


using the POST method and includes a required
field for the username.

⚪ The submit button sends data as soon as the


form changes. To send data on button click, the
button type must be onSubmit.

⚪ This form sends data to the server but cannot


handle file uploads due to the absence of the
enctype attribute.

[Link] 12/13
2/12/25, 12:25 PM Problem Solving Test | IT

⚪ The form uses an < input > tag with


type="name" for the username, but the lack of a
form attribute on the button means it is not
linked to the form.

⚪ The form attempts to send data to an


unspecified server address, which makes it non-
functional.

Back Next

67%

[Link] 13/13

You might also like