Unit 6: Web Application Development and Deployment - Practice Quiz

1 What is the main purpose of debugging?

2 What does a breakpoint do during debugging?

3 Which browser developer tool displays messages produced by console.log()?

4 Which browser developer tool is commonly used to inspect HTML elements and CSS styles?

5 Which JavaScript statement is used to handle an exception?

6 What is the purpose of the finally block in JavaScript error handling?

7 Which JavaScript method attaches an event handler to an HTML element?

8 Which event usually occurs when a user presses and releases a mouse button on an element?

9 Where does client-side JavaScript normally execute?

10 What is the DOM in a client-side web application?

11 Why are functions used to organize JavaScript code?

12 What is a common benefit of placing CSS in a separate stylesheet?

13 Which action commonly reduces the loading time of a web page?

14 What is browser caching used for?

15 What is a GitHub repository primarily used to store?

16 What does a Git commit represent?

17 What type of website is GitHub Pages commonly used to host?

18 Which file commonly serves as the home page of a GitHub Pages site?

19 Why should an image include meaningful alternative text?

20 How can GitHub Copilot assist a web developer?

21 A JavaScript function produces the correct result for most inputs but fails when the input array is empty. Which debugging technique is most appropriate for identifying the cause?

22 An event handler appears to run twice whenever a button is clicked. What should a developer investigate first?

23 A page sends a form submission, but the server returns an unexpected response. Which browser developer tools panel provides the most useful initial evidence?

24 A heading has the correct CSS class but displays with the wrong color. Which developer tools feature best identifies the rule overriding its color?

25 A client-side application calls an API with fetch(). Which approach correctly handles an HTTP 404 response?

26 An application displays data loaded from a remote service. What is the best user-facing behavior when the request fails?

27 A list contains many dynamically added delete buttons. Which event-handling strategy is most maintainable?

28 A custom dropdown can be opened with a mouse but not operated with a keyboard. Which change most directly improves its accessibility?

29 A single-page application must update the displayed products whenever its filter state changes. Which design is most appropriate?

30 Two components need the same API data and currently send identical requests whenever the page loads. Which design change best reduces duplication?

31 A JavaScript file mixes API requests, DOM updates, validation, and storage operations in one large function. What is the best refactoring approach?

32 Several modules need the same date-formatting behavior. Where should that behavior be placed?

33 A page's largest visible image delays the Largest Contentful Paint measurement. Which change is most likely to improve the result?

34 A website loads a large JavaScript bundle that contains code used only on an admin page. Which optimization best addresses this issue?

35 A developer wants to add a new feature without destabilizing the repository's main branch. Which workflow is most appropriate?

36 A merge conflict occurs because two branches changed the same lines. What should the developer do?

37 A project site is published at https://example.github.io/shop/, but its stylesheet is requested from https://example.github.io/styles.css and returns 404. Which change is appropriate?

38 A GitHub Pages site displays index.html, but server-side PHP code appears as text or does not execute. What is the reason?

39 A registration form currently validates required fields only with JavaScript in the browser. What should be added before production deployment?

40 GitHub Copilot suggests a function that builds SQL using direct string interpolation from a form value. What is the best response?

41 A production exception maps to a source line that cannot produce the observed error. Local debugging with the same source code works correctly. What should be verified first?

42 A timing-sensitive interface bug disappears whenever a normal breakpoint is added. Which technique is most appropriate for collecting evidence while minimizing disruption to execution timing?

43 A cross-origin fetch sends a custom X-Report-ID header. DevTools shows an OPTIONS request returning 403, while JavaScript receives only TypeError: Failed to fetch. Which change addresses the underlying failure?

44 Successive heap snapshots show increasing numbers of detached modal DOM trees. The retaining path leads from a document-level event listener to a closure that references each modal. What is the most direct correction?

45 The code fetch('/api/item/42').then(r => r.json()).then(render).catch(showError) displays a generic parsing error when the server returns an HTML 404 page. Which revision preserves the HTTP failure meaning?

46 A dashboard loads four independent widgets using Promise.all. One optional widget rejects, causing the dashboard to discard the other three successful results. Which design best supports partial rendering while retaining error information?

47 A list uses one delegated click listener, and each action button contains nested icons. Items may also be inserted dynamically. Which handler logic most reliably identifies a valid action button?

48 A modal visually overlays the page, but keyboard users can tab into background controls and lose their previous focus when it closes. Which behavior provides the strongest accessible interaction model?

49 A search interface sends a request after each query. Occasionally, a slow response for an older query overwrites the results of a newer query. Which design most robustly prevents stale commits?

50 An application stores todos, completedTodos, and completedCount as separately mutable state. After several updates, the three values disagree. Which redesign best preserves consistency?

51 Modules orders.js and payments.js import each other through a shared barrel file. Depending on import order, one module observes an uninitialized binding. What is the best structural remedy?

52 Importing a utility module in a unit test unexpectedly registers DOM listeners and starts a timer because the module executes setup at top level. Which refactoring best improves reuse and test isolation?

53 The Largest Contentful Paint element is a hero background image declared in a stylesheet that is discovered late. The image is above the fold and currently lazy-loaded by script. Which change most directly improves its discovery and priority?

54 A deployment uses content-hashed JavaScript filenames, but returning users sometimes keep an old HTML document that references assets removed by the new deployment. Which caching policy best limits this failure?

55 A repository accepts pull requests from forks. A workflow using pull_request_target checks out the contributor's head commit and then runs its build script with repository secrets available. What is the safest redesign?

56 A faulty merge commit has already been pulled by many developers from a protected main branch. The project must undo its changes while preserving shared history. Which action is appropriate?

57 A GitHub Pages project site is published at https://example.github.io/catalog/. The HTML loads, but assets requested from /assets/app.js return 404, and client routes omit /catalog/. What configuration is required?

58 A single-page application hosted on GitHub Pages works when navigating internally, but directly opening /reports/2025 returns the Pages 404. Server-side rewrite rules and redirect scripts are not allowed. Which routing strategy resolves this constraint?

59 An application converts untrusted Markdown comments to HTML and inserts the result with innerHTML. The Markdown library permits embedded HTML. Which defense most directly prevents stored DOM-based XSS while preserving supported formatting?

60 GitHub Copilot suggests authentication middleware that calls a JWT decode function and trusts the resulting role claim without verifying the token. What is the correct response before adopting the suggestion?